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)

---

摘自阮一峯