ES6常用知识点解析

一、let和const命令

let命令

1. 基本用法

ES6新增了let命令，用来声明变量。它的用法类似于var，但是所声明的变量，只在let命令所在的代码块内有效。

{
  let a = 10;
  var b = 1;
}

a // ReferenceError: a is not defined 只在块级作用域有效
b // 1

适用场景

for循环的计数器，就很合适使用let命令。

// ES5
for (var i = 0; i < 10; i++) {}
console.log(i); // 10  

// ES6，用let代替var
for (let i = 0; i < 10; i++) {}
console.log(i); // ReferenceError: i is not defined

上面代码中，变量i是var声明时，在全局范围内都有效。所以每一次循环，新的i值都会覆盖旧值，导致最后输出的是最后一轮的i的值。如果使用let，声明的变量仅在块级作用域内有效。

2. 特性

不存在变量提升

let不像var那样会发生“变量提升”现象。所以，变量一定要在声明后使用，否则报错。

console.log(foo); // undefined
console.log(bar); // ReferenceError

var foo = 2;
let bar = 2;

上述代码由于变量提升机制，实际执行的顺序如下：

var foo;
console.log(foo); // undefined
console.log(bar); // ReferenceError

foo = 2;
let bar = 2;

变量bar用let命令声明，不会发生变量提升。这表示在声明它之前，变量bar是不存在的，这时如果用到它，就会抛出一个错误。

暂时性死区

let声明所在的块级作用域内，只能先声明再使用，否则会抛出错误，这在语法上，称为“暂时性死区”（temporal dead zone，简称TDZ）。

var tmp = 123;

if (true) {
  tmp = 'abc'; // ReferenceError
  let tmp; // 由于使用let声明了tmp变量，所以只能先声明后使用，否则会产生暂时性死区。
}

不允许重复声明

let不允许在相同作用域内，重复声明同一个变量。

// 报错
function () {
  let a = 10;
  var a = 1;
}

// 报错
function () {
  let a = 10;
  let a = 1;
}

function func(arg) {
  let arg; // 报错
}

function func(arg) {
  {
    let arg; // 不报错，因为参数arg和变量arg属于不同的作用域
  }
}

3. 作用

块级作用域使得内外层变量间不再相互影响，同时减少变量提升带来的全局变量泄露问题，如计数器中的i变量不会泄露成全局变量。

---

const命令

1. 基本用法

const声明一个只读的常量。一旦声明，常量的值就不能改变。

const PI = 3.1415;
PI // 3.1415

PI = 3;
// TypeError: Assignment to constant variable.

const声明的变量不能改变值，这意味着，const一旦声明变量，就必须立即初始化，不能留到以后赋值。通常我们用它来声明固定不变的常量值，如字符串等。

对于复合类型的变量，变量名不指向数据，而是指向数据所在的地址。const命令只是保证变量名指向的地址不变，并不保证该地址的数据不变，所以将一个对象声明为常量必须非常小心，如下：

const foo = {};
foo.prop = 123;

foo.prop
// 123

foo = {}; // TypeError: "foo" is read-only

上面代码中，常量foo储存的是一个地址，这个地址指向一个对象。不可变的只是这个地址，即不能把foo指向另一个地址，但对象本身是可变的，所以依然可以为其添加新属性。

2. 特性

const命令声明的常量也没有变量提升。
const同样存在暂时性死区，只能在声明的位置后面使用。
const声明的常量，也与let一样不可重复声明。