ES6 let和const命令

1.1 let和const

1.1.1 let基本用法

用法类似var，表示常量，只在let命令所在代码块内有效。

1.1.2 const基本用法

const声明只读常量。一旦声明常量的志不能变。一旦声明，必须立即赋初始值，不能留到以后赋值。

const foo = {};

// 为 foo 添加一个属性，可以成功
foo.prop = 123;
foo.prop // 123

// 将 foo 指向另一个对象，就会报错
foo = {}; // TypeError: "foo" is read-only

本质：const实际上保证的，并不是变量的值不得改动，而是变量指向的那个内存地址所保存的数据不得改动。

1.2.3 let和const共同点

1.不存在变量提升

变量提升：var命令会发生“变量提升”现象，即变量可以在声明之前使用，值为undefined

// var 的情况
console.log(foo); // 输出undefined
var foo = 2;

// let或const 的情况
console.log(bar1); // 报错ReferenceError
console.log(bar2)
let bar1 = 2;
const bar2 = 3;

2.暂时性死区

只要块级作用域内，存在let或const命令，它所声明的变量就绑定这个区域，不再受外部的影响。

var tmp = 123;

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

在代码块内，使用let或const命令声明变量之前，该变量都是不可用的。这在语法上，称为“暂时性死区”。

ES6 规定暂时性死区和let、const语句不出现变量提升，主要是为了减少运行时错误，防止在变量声明前就使用这个变量，从而导致意料之外的行为。

3.不允许重复声明

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

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

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

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

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

1.2块级作用域

好处

1.外层代码块不受内层代码块影响，外层作用域无法读取内层作用域的变量，内层作用域可以定义外层作用域的同名变量而不受影响。

// ES6
function foo(){
    let a = 0;
    if(true){
        let a = 1;
    }
    console.log(a); // 0
}

// ES5
function foo(){
    var a = 0;
    if(true){
        var a = 1;
    }
    console.log(a); // 1
}

2.循环变量不会泄漏为全局变量

// ES6
let s = 'hello';
for(let i = 0;i<s.length;i++){
  console.log(s[i]);
}
console.log(i); // 报错， i is not defined

// ES5
var s = 'hello';
for(var i = 0;i<s.length;i++){
  console.log(s[i]);
}
console.log(i); // 5

3.函数执行更简洁

// ES6
{
    ...;
}

// 匿名立即执行函数表达式
(function(){
    ...;
}());

1.3ES6六种声明变量的方法

• var(ES5)
• function(ES5)
• let(ES6)
• const(ES6)
• import(ES6)
• class(ES6)

---

摘自阮一峰