es6 let命令的基本用法

首先，let命令是es6新增的，也是用來宣告變數的，但它與var不同的是：「只在let命令所在的**塊內有效」。換一句話說就是：「let命令宣告的變數只在當前作用域內有效（包括它的子作用域）」。那麼結合它的特徵概括起來就是：「let是es6用來宣告只在當前作用域內有效，不存在變數提公升，不能重複宣告的，會形成暫時性死區變數的乙個命令」。

「只在當前作用域內有效」是let命令最基本的特徵。為了說明什麼是只在當前作用域內有效，我們可以看看下面的案例：

if (true) 
console.log(b); //
error: b is
not defined

同樣是宣告乙個變數，用var宣告的可以在if語句之外列印出來，而用let宣告的則報錯。這是因為在es6的語法環境當中if語句的「{}」部分是乙個「塊級作用域（如果您還不知道什麼是塊級作用域，請參考《es6 塊級作用域的基本用法》）」，而用let宣告的變數只在當前作用域內有效，因此在if**塊之外輸出變數「b」將會報「error: b is not defined」的錯誤。

同樣的，在下面的塊級作用域內，也會有類似的結果。

例一：

//es5語法的var命令
for (var i = 0; i < 10; i++) 
console.log(i); //10
//es6語法的let命令
for (let x = 0; x < 10; x++) 
console.log(x); //error: x is not defined

例二：

//es5語法的var命令
function
testa
() testa();
console.log(a); //error: a is not defined
//es6語法的let命令
function
testb
() testb();
console.log(b); //error: b is not defined

注意：函式在es5當中稱為「函式作用域」，同樣的它也遵守這樣的規則：「父作用域不能訪問子作用域內宣告的變數」。因此，「只在當前作用域內有效」並不是es6特有的，只是在es5語言環境中if邏輯判斷和for迴圈等語句沒有被當做「塊級作用域」來解析。

例三：

//es5語法的var命令
//es6語法的let命令
console.log(b); //
error: b is
not defined

注意：成對的「{}」在es6語言環境中乙個「塊級作用域」，而在es5中不是。

當然，除了上面的案例以外，還有很多案例都可以能說明「只在當前作用域內有效」這個特徵，這裡將不在一一枚舉。

在es5語言環境的非嚴格模式（「use strict」）中，經常會見到這樣的奇葩寫法「在var宣告的變數之前呼叫這個變數，然後得到的值通常為undefined」，這種現象通常被成為「變數提公升」。按照我們對現實世界的一般邏輯理解是「先有乙個事物之後再去使用這個事物」，同樣在「**世界」裡，我們同樣也這樣認為「變數應該在宣告語句之後才可以使用」。為了糾正這種「奇葩」現象，let命令改變了語法行為，它所宣告的變數一定要在宣告後使用，否則報錯。

//es5語法的var命令
console.log(a); //
undefined
//es6語法的let命令
console.log(b); //
error: b is
not defined
let b = 'banana';

注意：上述案例最好在chrome瀏覽器的控制台（console）下直接編寫**進行演示，因為採用babel編譯器編譯後的**為普通的es5**，從而導致變數「b」的結果也為「undefined」。

let語法規定：「不允許在相同作用域內，重複宣告同乙個變數。」

例如：

//es5語法的var命令
var a = 'aaaa';
//es6語法的let命令
let b = 'banana';
let b = 'bbbb'; //error:duplicate declaration "b"

通過翻譯「duplicate declaration 『b』」我們可以知道，它的報錯意思是：「重複生命了『b』。」

結合let命令的「不存在變數提公升」和「不允許重複宣告」這兩個特徵，我們可以輕鬆的理解「暫時性死區」這個特徵。即：「只要塊級作用域內存在let命令，它所宣告的變數就『繫結』（binding）這個區域，不再受外部的影響。」

例如：;(function

() )();

//es6語法的let命令

let b = 'banana';

**解析：在es6語言環境中「{}」是乙個塊級作用域，由於let命令不允許在相同作用域內重複宣告同乙個變數，以及不存在變數提公升的特徵，因此上述案例中在let命令宣告變數「b」之前使用它是錯誤的。

es6 let命令的基本用法

ES6 let變數宣告

ES6 let 和 const命令（學習筆記）

ES6 let與const，解構賦值

es6 let命令的基本用法

ES6 let變數宣告

ES6 let 和 const命令（學習筆記）

ES6 let與const，解構賦值

相關推薦