ECMAScript 6语法及运用（一）——let和const命令

1.let 声明块级作用域

• 不能重复声明同一个变量
  在ES5中，var可以重复声明同一个变量，例如

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

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

  这样很容易在编写代码时出现不容发觉的小bug，于是ES6中规定，let声明不允许重复声明同一个变量。

let a = 10;
console.log(a);

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

Uncaught SyntaxError: Identifier ‘a’ has already been declared
“变量已存在 不允许重复声明”

• 存在块级作用域

if(false){
    let c = 20;
}
console.log(c);

Uncaught ReferenceError: c is not defined

  let声明只在if作用域中有用，当在if作用域外调用变量c的时候，便会报错。

  由于这一特性，所以像for循环中就很适合用let声明变量。

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

console.log(i);//Uncaught ReferenceError: i is not defined

  【注意】：ES6 的块级作用域必须有大括号，如果没有大括号，JavaScript 引擎就认为不存在块级作用域。

// 第一种写法
if (true) let x = 1;//报错 Uncaught SyntaxError: Lexical declaration cannot appear in a single-statement context

// 第二种写法
if (true) {
  let x = 1;//不报错
}

  在上述代码中，第一种写法没有大括号，JavaScript 引擎认为不存在块级作用域，而let只能出现在当前作用域的顶层，所以报错。

• 不存在变量提升
  “变量提升”现象，即变量可以在声明之前使用，var声明便可以：

console.log(a);
var a=10

10

  而在ES6新增的let命令中，纠正了这一现象：

console.log(a);
let a=10;

Uncaught ReferenceError: Cannot access ‘a’ before initialization

  即let所声明的变量一定要在声明后使用，否则报错。

  一个小例子：实现每隔1秒打印数字0-4

  ==>如果用var定义变量：

for(var i = 0; i < 5; i++){
    setTimeout(function(){
        console.log(i);
    },i*1000)
}

  会重复打印5:

  因为var定义的是全局变量，循环完后，变量i的值变成了5，所以会重复打印。为了实现打印不同的数字，循环内应使用块级声明变量let。

for(let i = 0; i < 5; i++){
    setTimeout(function(){
        console.log(i);
    },i*1000)
}

• 暂时性死区（temporal dead zone，简称 TDZ）
  只要块级作用域内存在let命令，它所声明的变量就“绑定”这个区域，不再受外部的影响。

var str = 123;

if (true) {
  str= 'abc'; // ReferenceError
  let str;
}

Uncaught ReferenceError: Cannot access ‘tmp’ before initialization

  在上述代码中，存在全局变量str，但是在块级作用域if中let又声明了局部变量str，所以后者便与块级作用域绑定，在声明前给变量赋值，便会报错。

2.const 声明一个只读的常量

• 声明后，常量的值不允许改变
  如果用var声明变量，下面的写法没有问题。

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

20

  如果改用const声明变量，则会报错。

const A=10;
console.log(A);//10

A=20;
console.log(A);//报错

10
Uncaught TypeError: Assignment to constant variable.

• 声明常量后，必须立即初始化

const fa;

Uncaught SyntaxError: Missing initializer in const declaration.

  声明常量后没有赋值，会报错。

• 应用场景：模块级别用常量定义
• 其他特点：和let命令一样

  const实际上保证的，并不是变量的值不得改动，而是变量指向的那个内存地址所保存的数据不得改动。另外，const定义的常量一般用大写字母表示，方便与变量区分。

---

更多详细解析和实例请参照阮一峰的文档《ECMAScript 6 入门》