ES6 中的let 與 const關鍵字

ES6 中的let 與 const關鍵字

博客說明

文章所涉及的資料來自互聯網整理和我的總結，意在於我的學習和經驗彙總，若有什麼地方侵權，請聯繫本人刪除，謝謝！

簡介

let和const是es6新增長的兩個關鍵字，主要做用是用來聲明變量

let關鍵字

用法

let 聲明的變量只在 let 命令所在的代碼塊內有效，不能重複聲明

{ 
    let a = 0;  
    var b = 1;
    a   //此時輸出 0 
    b   //此時輸出 1
} 
a   // 此時報錯 ReferenceError: a is not defined
b   // 此時輸出 1

經常使用環境

在使用for循環時，適合使用let命令

for (let i = 0; i < 10; i++){
    ...
}
i // 此時報錯 ReferenceError: i is not defined

在上述代碼中，i只在for循環體之中有效，在循環體以外調用就會報錯

var a = [];
for (var i = 0; i < 10; i++){
  a[i] = function(){
    console.log(i);
  }
}
a[8]();  // 10

在上述代碼中，變量i是var命令聲明的，在全局範圍內都有效，因此全局只有一個變量i。

每一次循環，變量i的值都會發生改變，而循環內被賦給數組a的函數內部的console.log(i)，裏面的i指向的就是全局的i。也就是說，全部數組a的成員裏面的i，指向的都是同一個i，致使運行時輸出的是最後一輪的i的值，也就是 10。

var a = [];
for (let i = 0; i < 10; i++){
  a[i] = function(){
    console.log(i);
  }
}
a[8]();  // 8

若是使用let，聲明的變量僅在塊級做用域內有效，最後輸出的是 8。

不存在變量提高

let不存在變量提高，var存在變量提高

var命令會發生「變量提高」現象，即變量能夠在聲明以前使用，值爲undefined，let命令改變了語法行爲，它所聲明的變量必定要在聲明後使用，不然報錯。

console.log(a); //ReferenceError: a is not defined 
let a = "apple"; 

console.log(b); //undefined 
var b = "banana";

上述代碼中，b在腳本開始運行時就存在了，可是尚未進行賦值，因此返回undefined。a在變量聲明以前不存在，因此會報錯。

const關鍵字

用法

const 聲明一個只讀變量，聲明以後不容許改變

const PI = "3.1415926";
PI  // 此時輸出3.1415926

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

const MY_AGE;  // 此時報錯SyntaxError: Missing initializer in const declaration

const一旦聲明必須初始化，不然會報錯，只聲明不賦值也會報錯

暫時性死區（TDZ）

只要代碼塊中包含let或者const，它所聲明的變量就會綁定這個區域，不會再受外部的影響

var tmp = 123;

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

暫時性死區的範圍

在代碼塊內，使用let或者const命令聲明變量以前，該變量都是不可用的。

if (true) {
  // TDZ開始
  tmp = 'abc'; // ReferenceError
  console.log(tmp); // ReferenceError

  let tmp; // TDZ結束
  console.log(tmp); // undefined

  tmp = 123;
  console.log(tmp); // 123
}

感謝

萬能的網絡

菜鳥教程

阮一峯的es6語法教程

以及勤勞的本身，我的博客，GitHub