ES6中的let與const---let與var的區別---詳解

let是ES6中新增的，是對變量的聲明。與var用法類似，但是大有不同。

1. let不允許重復聲明變量，var可以

var a = 1;
var a = 2;
console.log(a); //輸出結果為 2

let b = 2;
let b = 3;
console.log(b);  //報錯

但是，如果let聲明了一個變量，變量的值可以改變。

let b = 2;
b = 3;//這里是賦值，不是聲明
console.log(b);  //3   

2. let沒有變量提升，也就是不會在預解析的時候進行解析。

console.log(a);//undefined
var a;
        
console.log(b);
let b;   //報錯

3. 聲明的變量只在let命令所在的代碼塊內{}有效。

for(let i = 0; i < 3; i++){
      i = i;
}
console.log(i); //ReferenceError: i is not defined

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

ES6中允許塊作用域任意嵌套，外層無法訪問內層的變量。但是內層可以訪問外層，也就是子級訪問父級；

        {
            let a = 1;
            {
                console.log(a);  //1
                {
                    console.log(a);  //1
                }
            }
        }

        {
            console.log(a); //ReferenceError: a is not defined
            {
                let a = 1;
            }
        }

        {
            console.log(a); //undefined
            {
                var a = 1;
            }
        }

注意：上面代碼結果為undefined，是因為預解析，var a變量提升；

在下面for循環中，如果使用var，將返回5。

var arr = [];
for(var i = 0; i < 5; i++){
    arr[i] = function(){
        console.log(i);
    }
}
arr[3](); // 輸出5；

因為，var 聲明的i是一個全局變量，i 的值隨着每次循環發生改變，但是function里面的 i 都是指向同一個 i，那就是全局的變量 i，也就是說返回的是循環結束后最終的 i 的值5。

用白話來說的話就是，每次循環都給數組增添了一個值，隨着循環的進行，已經加入到數組了，每個值都是一個函數，每個函數都是function(){console.log(i)};for循環在一瞬間就完成了，當去調用函數時，函數讓輸出i，i指向全局，此時循環結束 var i = 5;所以最終返回5。

如果將for循環的var聲明改成let聲明，那么將會返回3。

var arr = [];
for(let i = 0; i < 5; i++){
    arr[i] = function(){
        console.log(i);
    }
}
arr[3](); // 輸出3；

這是因為如果i用let來聲明，那么當前的i只在本輪循環有效，每次的循環都是重新定義i。那么重新定義的話為什么i的值不一直是0？這是因為javascript引擎內部會記住上一次循環的值，再進行初始化時，是按照上一次循環的基礎進行計算。

此外，在for循環中，設置循環變量那部分是一個父級作用域，而循環內部是一個單獨子作用域。

for(let i = 0; i < 2; i++){
    let i = 200;
    console.log(i); 
    //200
    //200
}

for循環的內部是一個子作用域，let聲明只在該代碼塊有效，所以外層let不受影響，循環2次。

硬性標准：代碼塊{}內，let聲明的變量就綁定在這個區域，不再受外部的影響。

 

 

 

 

再來說說 const

const也ES6新增的定義常量的關鍵字。注意：一旦聲明，常量的值不能改變的！

1. 常量一定要賦值，否則報錯

const a;
console.log(a); //SyntaxError: missing = in const declaration

2. 常量的值不能改變，改變會報錯

const a = 10;
a = 99;
console.log(a); //TypeError: invalid assignment to const `a'

3. 常量不能重復聲明，否則報錯

const a = 10;
const a = 99;
console.log(a); //SyntaxError: redeclaration of const a

其他特點和let一樣