ES6 let命令和const命令

基于ES6标准入门（第3版）这本书的笔记
要学习angula，vue，react等新的前端框架，必须先熟悉ES6的语法

---

let 变量

ES6中的let新增了let变量，用法和var类似，只是作用范围只在声明的代码块中有效

{
    let a = 123;
    var b = 1;
    console.log(a);
    console.log(b);
}
console.log(a);
console.log(b);

控制台会输出

123
1
1
Uncaught ReferenceError: a is not defined

可以看出let声明的变量超出代码块后会报错未定义

在for循环中使用let变量和在var变量的区别

在for循环中用var定义一个变量，然后定义方法，因为var i 定义出来是全局变量，所以控制台输出的时候一定会输出最后一轮的值，也就是5

var arr = [];
for(var i = 0; i < 5; i++){
    arr[i] = function () {
        console.log(i);
    } ;
}
arr[3]();

在for循环中用let声明的变量，var变量是局部的，每一轮都会有一个新的i，所以控制台输出的是3

var arr = [];
for(let i = 0; i < 5; i++){
    arr[i] = function () {
        console.log(i);
    } ;
}
arr[3]();

在for循环中，循环变量是父级作用域，循环体内是子作用域，如果两个循环定义了两个let变量，变量名一样，那么是互不干扰的，控制台会输出123

for(let i = 0; i < 5; i++){
    let i = '123';
    console.log(i);
}

还需要注意一点，在js中，如果用var声明的变量，在声明前使用变量，只是会报错undefined，但是如果是let声明的变量会报错ReferenceError，这里我自己测试的时候都是报错的undefined，不过正常写代码也应该是先声明后使用。

let变量使用注意事项

如果在全局声明了一个变量var temp，然后有在块中声明了一个变量let temp ，那么在声明的let temp前面对temp重新赋值，会报错ReferenceError（本地代码报错事undefined，可能是版本不一样的原因），语法上成为暂时性假死（TDZ）,

• 第一个console.log输出的是undefined
• 第二个console.log输出的是zxc
• 第三个console.log输出的是undefined
• 第四个console.log输出的是cvb

var temp = 'abc';
if(true){
    console.log(temp);
    temp = 'zxc';
    console.log(temp);
    let temp;
    console.log(temp);
    temp = 'cvb';
    console.log(temp);
}

在同一个作用域内let变量不允许重复声明，这里var变量重复声明不会报错，let变量声明了后ide工具也会直接提示报错，就算忽略了代码也是不能运行的

{
    var a ='123';
    var a = '321';

    let b = 'abc';
    let b = 'cba';
}

不过如果是父级作用域嵌套同名子作用域是不会报错的

{
    let b = 'abc';
    {
        let b = 'cba'; // 不报错
    }
    
    function f(c) {
        let c; // 报错
    }
    
    function f1(c) {
        {
            let c; // 不报错
        }
    }
}

const 变量

const声明一个只读常量，一旦声明了，常量的值就不能改变了，其作用域也是在代码块里面。const 常量声明你必须马上赋值，不能只声明不赋值。和let变量一样，const变量不能重复声明。

{
    const pi = 12.5;
    pi = 1; // 报错

    const a;// 报错
    
    const b = 321;
    const b =123; // 报错
}

ES6声明变量的6种方法

es5只有两种方法声明变量，var和function，es6除了var，function还有let和const，除了这四种还有import和class，后面介绍