let和const

1、let命令

 

一、块级做用域

ES5只有全局做用域和函数做用域，没有块级做用域，所以会出现下面这样的问题:

for(var i = 0; i < 10; i ++){

}
console.log(i);

代码块内声明的变量，代码块外同样能够访问。这种状况不少时候是不合理的。

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

进行 10 次循环，第一次全局声明变量 i，以后每次更新 i 的值，数组 arr 保存着 10 个函数，每一个函数等到运行时访问全局变量 i ，固然每次调用函数都是输出 10。这个问题下面的介绍就能解决。

 

二、基本使用

ES6新增了 let 命令，和 var 同样，也是用来声明变量的。但它所声明的变量，只在代码块内有效。

for(let i = 0; i < 10; i ++){

}
console.log(i);   // error


if(true){
    let a = 10;
}
console.log(a);   // error

 

三、不存在变量提高

ES5中使用 var 是会发生变量提高的:

console.log(i);
var i = 0;   // undefined

// 等同于

var i;
console.log(i);
i = 0;

ES6中使用 let 不会:

console.log(i);   // error
let i = 10;

 

四、暂时性死区

代码块内的变量不管是ES5仍是ES6均可以往上查找值的:

var a = 10;
if(true){
    console.log(a);   // 10
}

let a = 10;
if(true){
    console.log(a);   // 10
}

可是只要块级做用域内使用了 let 命令，它所声明的变量，就绑定了这个区域，再也不受外部的影响，下面这种状况会报错:

let a = 10;
if(true){
    console.log(a);   // error
    let a;
}

由于let命令没有变量提高,因此你在变量声明以前使用该变量就是不行，无论你代码块外部作了什么操做，因此若是你决定使用ES6语法规则，仍是老老实实先定义后使用吧。

 

五、不容许在同一个做用域内重复声明变量

ES5中重复声明变量是没有问题的:

var a = 10;
var a = 20;
console.log(a);   // 20

ES6很较真，你敢这样作，我就敢报错:

let a = 10;
let a = 20;   // error

别忘了，ES6是有块级做用域的，因此下面这样仍是彻底能够的:

let a = 10;
if(true){
    let a = 20;
    console.log(a);
}
console.log(a);
// 20
// 10

如今解决上面那个问题，就很简单了:

let arr = [];
for(let i = 0; i < 10; i ++){
    arr[i] = () => {
        console.log(i);
    }
}
arr[3]();   // 3

 

2、const命令

 

 一、基本使用

ES6中声明一个只读的常量是用 const，它与 let 大部分都相同:

 

• 不容许重复声明
• 拥有块级做用域
• 声明的常量不会变量提高
• 存在暂时性死区

 

但有俩点不一样。

一、一旦声明，就要初始化(按照规定，常量最好使用大写):

const A;   // error

因此仍是声明就当即赋值吧:

const A = 10;

二、第二点不一样就是，不可后面更改它的值:

const A = 10;
A = 20;   // error

 

注意:

因为在 js 中，一个变量保存着一个复合类型（Array、Object、Function）的数据，仅仅保存的是该数据的地址，因此只要地址不换，就不会报错:

const MYARRAY = ['apple', 'banana'];
MYARRAY.push('orange');
console.log(MYARRAY);   // [ "apple", "banana", "orange" ]

const MYOBJECT =  {
    username: 'tom'
};
MYOBJECT.age = 24;
console.log(MYOBJECT);   // { username: "tom", age: 24 }

只有把地址都换了，才报错:

const MYOBJECT = {
    username: 'tom'
};
MYOBJECT = {   // error
    username: 'tom',
    age: 24
};

 

 上面代码实际上是为常量 MYOBJECT 从新赋值了一个对象。