為什麼你不應該再使用『var』 –Hacker Noon

我使用ES2015 (ES6)語法編寫JavaScript已經有一陣了，並且對它的許多優雅、簡易的變化更加欣賞。首先最簡單的變化就是適應了採用 / 來代替 。不管怎樣，我認為 帶來的益處是超過 的；它並不是 的一個華而不實的新語法，而是提供了重要的範圍機制。

我認為 帶來的益處是超過 的

值得注意的是，我聲明的絕大多數變數都最適合使用 而不是 / 。因為 聲明之後如果企圖修改它的值，就會拋出錯誤，這是預防意外變化的有用特性。然而，通常需要的是可變的變數，特別是在循環中的計數器。如果它們都提供了基礎的可變性，為什麼還要在這些情況下用 來代替 呢？

答案很簡單，因為提供了塊級作用域，這是 的函數作用域所缺少的。這個解釋是一個實際的例子。請允許我用一個經典的前端面試題來證明這個重要的差別：

在例子中，控制台上列印出來的是什麼呢？

var callbacks = []; (function() { for (var i = 0; i

在這個例子中，我們循環了5次，每次將一個函數添加到 數組中。在數組中填滿5個函數後，運行每個函數，將其結果在控制台上列印出來。新人工程師也許會回答（錯誤地）結果是 ，這是合理的分析，不過成了JavaScript「變數提升」的受害人。

GIF/949K

不要變成受害者。使用『let』來避免變數提升的陷阱！

正確答案實際上是 ，當你考慮下其中的變數提升時，這是講得通的：

var callbacks = []; (function() { **var i;** for (**i** = 0; i

注意JavaScript是如何將變數聲明提升到函數塊的頂部的，導致在每個回調函數執行時， 都是 ，因為 循環在這些函數調用之前就添加好了。

有許多經典的方法來解決這個問題，讓腳本可以在控制台上列印 ，但是 提供了一種最簡單的解決方案：

var callbacks = []; (function() { for (**let** i = 0; i

就是這樣—只需要用替換，這個例子就能按預期工作了！這都要歸功於 的塊級作用域行為。比起被提升到函數作用域的頂部， 保持在循環的塊作用域里，為每個迭代提供一個單獨的 的實例。

那麼，你還要使用 嗎？如同你從本文標題獲取到的，我認為不應該再使用。從技術上講， 在你想要保持函數作用域而不是塊級作用域的情況下是有用的，但我確定，如果你需要依賴不直觀的變數提升來讓你的腳本工作，你自己也是有問題的 :stuck_out_tongue_winking_eye:。

更新：針對讀者提出的兩個最常見的討論點：

是真的不可變的。例如：

const myNotQuiteImmutableObject = { thisCanBeChanged: "not immutable" };myNotQuiteImmutableObject.thisCanBeChanged = "see I changed it.";

這仍然可以防止根本的變化，如：

const immutableString = "you can t change me";immutableString = "D OH!"; // error

如果你需要真的不可變，請查看Facebook的優秀Immutable庫。

2.「 不支持 。」這是真的，甚至有些最新的瀏覽器也沒有支持。Babel允許你使用JavaScript所有的最佳、最新特性，然後將其轉換成即使IE8也能讀的語法（除了一些例外）。

喜歡這篇文章嗎？立刻分享出去讓更多人知道吧！