ECMAScript(ES) 6 之 let 与 const

当前位置:

首页 > temp > JavaScript教程 >

ECMAScript(ES) 6 之 let 与 const

ES6 新增加了两个重要的 JavaScript 关键字：let 和 const

先说一下 const ：它用于声明一个只读的常量，一旦声明，常量的值就不能改变。

const servicePath = "www.baidu.com";
      servicePath = "www.sina.com";
console.log(servicePath);
//Uncaught TypeError: Assignment to constant variable.

由于const声明的是一个只读变量，不可被改变，所以声明变量是就必须赋值，否自也会报错。

const servicePath;
console.log(servicePath);
//Uncaught SyntaxError: Missing initializer in const declaration

要注意的是用const声明的常量如果是一个 Object ，虽然Object.item不会被改变，但是可以用 Object.push(something)添加数组内容，如果不希望数组被改变，可使用 Object.freeze()将其冻结。

1 const arr1 =['apple','banana'];
2 　　　 arr1.push('orange');
3 console.log(arr1);
4 //["apple", "banana", "orange"]
5 const arr2 = Object.freeze(['apple','banana']);
6       arr2.push('orange');
7 console.log(arr2);
8 //Uncaught TypeError: Cannot add property 2, object is not extensible

let 用法与之前的 var 大致上相同，要注意的几点是：

1. 同一个作用域里，不能重复定义变量（可以重新赋值）。

　　{ }括起来的的区域是一个块级作用域，不同的块级作用域 let 两个相同名字的变量，实际上是两个完全独立没有联系的变量。

 1 function a()｛
 2 　　let a = "abc";
 3 　　let b = "abc";
 4 　　let c = 10; 
 5 　　console.log(a);// abc
 6 　　function b(){
 7 　　　　let a = 22;
 8 　　　　console.log(a);//22
 9 　　}
10 　　function c(){
11 　　　　let a = function(){return 1;}
12 　　　　console.log(a);//1
13 　　}
14 　　let b = 22;
15 　　console.log(b);//Identifier 'b' has already been declared
16 　　c = 15;
17 　　console.log(c);//15
18 }

2. 没有预解析，不存在变量提升。

1 function fn(){
2 　　alert(a);  //TDZ开始  暂时性死区
3    let a = 5;  //TDZ 结束
4 }
5 fn();
6 //a is not defined

3. for循环，for循环里面是父级作用域，{ }里面又一个作用域

 1 var arr1 =[];
 2 for(var i=0; i<10; i++){
 3 　　 arr1[i]=function(){
 4    　　 console.log(i);
 5　　 }
 6 }
 7 arr1[5](); //10
 8 
 9 var arr2 =[];
10 for(let i=0; i<10; i++){
11　　 arr2[i]=function(){
12   　　 console.log(i);
13    }
14 }
15 arr2[5]();//5

在熟悉 let 和 const 的用法之后，建议逐步放弃var的用法，改为使用 let 或者 const。

PS：在顶层作用域下 var 定义变量是属于window的，而 let 和 const 不属于。

栏目列表