1. 程式人生 > >var 和 let詳解

var 和 let詳解

ES6新增let命令,用來宣告變數。let的用法和var有以下幾點區別:

1. 瀏覽器的預解析策略不同

瀏覽器在執行程式碼之前會預解析,首先解析函式宣告,變數定義,解析完後再對函式變數進行運算、賦值等。

    -var變數,無論var變數處於當前作用域的第幾行,都將var變數提升到作用域的頭部並初始化為undefine。

    -let變數,let變數也被提升到當前作用域的頭部,但不初始化。

2. 聲明後未賦值,表現相同

(function() {
      var varT;
      let letT;
      console.log(varT); //輸出undefined
      console.log(letT); //輸出undefined
    }());

3. 使用未宣告的變數,表現不同:

(function() {
  console.log(varT); //輸出undefined
  console.log(letT); //直接報錯:ReferenceError: letT is not defined

  var varT = 'test var OK.';
  let letT = 'test let OK.';
}());

4. 重複宣告同一個變數時,表現不同:

(function() {
      var varT = 'test var OK.';
      let letT = 'test let OK.';

      var varT = 'varT changed.';
      let letT = 'letT changed.'; //直接報錯:SyntaxError: Identifier 'letT' has already been declared

      console.log(varT); //輸出varT changed.(注意要註釋掉上面letT變數的重複宣告才能執行)
      console.log(letT); //輸出test let OK.
    }());

5. 變數作用範圍,表現不同:

(function() {
  var varT = 'test var OK.';
  let letT = 'test let OK.';

  {
    var varT = 'varT changed.';
    let letT = 'letT changed.';
  }

  console.log(varT); //輸出"varT changed.",內部"{}"中宣告的varT變數覆蓋外部的letT宣告
  console.log(letT); //輸出"test let OK.",內部"{}"中宣告的letT和外部的letT不是同一個變數
}());

備註:

使用 let 語句宣告一個變數,該變數的範圍限於宣告它的塊中。  可以在宣告變數時為變數賦值,也可以稍後在指令碼中給變數賦值。  

使用 let 宣告的變數,在宣告前無法使用,否則將會導致錯誤。

如果未在 let 語句中初始化您的變數,則將自動為其分配 JavaScript 值 undefined。