我們的學習或是工作中會牽涉到JavaScript,那麼也一定要了解JavaScript,let語句是JavaScript很大一部分組成。這篇文章有助於你了解並且掌握let 語句,讓我們我們來好好研究一下。
使用let語句,允許你在JavaScript中建立區塊範圍局部變數。 let語句是在JavaScript的ECMAScript 6標準中引入的。在你往下了解let語句之前,我建議你先查看基於Infragistics jQuery庫的Ignite UI,它可以幫助你更快地編寫和運行Web應用程式。你可以使用JavaScript庫的Ignite UI來快速解決HTML5,jQuery,Angular,React或ASP.NET MVC中複雜的LOB需求。 (你可以在這裡下載Ignite UI的免費試用版。)
在ECMAScript 6之前,JavaScript有三種類型的範圍:
全域範圍
函數範圍
詞彙範圍
為了詳細探索let語句,請細想下面的程式碼片段:
function foo() { var x = 9; if (x > 5) { var x = 7; console.log("Value of x in if statement = " + x); } console.log("Value of x outside if statement = " + x); } foo();
以上程式碼得到的輸出:
在上面的程式碼中,我們使用var語句宣告變數x。因此,變數x的範圍是函數範圍。 if語句內的變數x 是if語句外建立的變數x 。因此,當你修改if語句區塊內變數x的值時,也會修改函數中變數x的所有引用的值。
為了避免這種情況,你需要使用區塊層級範圍,let語句允許你建立區塊範圍的局部變數。
修改上面的程式碼片段,使用let語句宣告變數:
function foo() { var x = 9; if (x > 5) { let x = 7; console.log("Value of x in if statement = " + x); } console.log("Value of x outside if statement = " + x); } foo();
在上面的程式碼片段中,我們使用let語句來宣告範圍級局部變數x。因此,在if語句內更新變數x的值不會影響if語句外的變數x的值。
下面是上述程式碼的輸出:
與使用函數範圍(或全域範圍)宣告的變數不同,使用let宣告的變數是區塊範圍的:它們只存在於它們定義的區塊中。
變數提升
使用let宣告的變數提升不同於使用var宣告的變數。因此,使用let宣告的變數沒有變數提升,這表示使用let宣告的變數不會移動到執行上下文的頂部。
為了更好地理解這一點,請看以下這段程式碼:
function foo() { console.log(x); console.log(y); var x = 9; let y = 67; } foo();
作為輸出,你將獲得變數y的ReferenceError,變數y使用let語句宣告。使用let宣告的變數不會提升到執行上下文之上。
重新宣告變數
你不能在同一個函數或區塊中使用let重新宣告一個變數。這樣做會出現語法錯誤。請看以下程式碼:
function foo() { if(true){ let x = 9; let x = 89; } } foo();
執行上面的程式碼會出來一個語法錯誤,如下所示:
暫時性死區
有時,使用let宣告的變數會導致暫時性死區。在下列程式碼中,let x=x+67 將拋出x未定義的例外。
之所以會出現這個錯誤,是因為表達式(x + 67)求的是if塊範圍內局部變數x的值,而不是函數範圍內的局部變數x值。執行上面的程式碼,你會得到這樣一個異常:
區塊級範圍界定是任何程式語言最重要的功能之一,並且隨著ECMAScript 6中let語句的引進,JavaScript現在也有了這個功能。使用let語句,允許建立一個作用域在區塊範圍內的變數。這可以解決許多問題,例如全域範圍變數的意外修改,閉包中的局部變量,以及幫助編寫更清晰的程式碼。
在了解JavaScript系列的下一篇文章中,我們將介紹JavaScript函數中的rest參數。你可以在php.cn網站上詳細了解有關這方面的內容。此外,不要忘記查看Ignite UI,它可以與HTML5,Angular,React或ASP.NET MVC一起來幫助創建豐富的互聯網應用程式。
以上就是了解JavaScript,了解 let 語句全文,有興趣的朋友可以一起交流探討。
相關閱讀:
以上是了解JavaScript,了解 let 語句的詳細內容。更多資訊請關注PHP中文網其他相關文章!