使用 var 重新聲明有效，但不適用於 Chrome 代碼段中的 let

Question

我開始學習 JavaScript，我在 Google Chrome 中使用 Snippets 或控制台。 我不明白一件事。 當我運行片段時：

let x = 5;
console.log(x);

多次。 一切都很好，但是當我第一次運行它時：

var x = 5;
console.log(x);

然后我將代碼更改為使用 let：

let x = 5;
console.log(x);

我收到錯誤SyntaxError: Identifier 'x' has already been declared我不明白為什么。 我假設用 let 聲明的變量在某種程度上是“易失的”，但用 var 聲明的變量與 window object 相關聯，所以它們是“非易失的”？ 或者更一般地說：腳本執行后全局環境的聲明性環境記錄中的聲明是否被清除，但存儲在全局環境的 object 環境記錄中的聲明不是？ 當我在 Google Chrome Snippets/Console 中多次運行代碼段時，它是在相同的執行上下文中運行還是每次按下運行按鈕時都使用新的全局環境重新創建？

Answer 1

您使用的是哪個 Chrome 版本？ 從 Chrome 80 開始，您可以在瀏覽器控制台中重新聲明 let 變量。 但請記住，這只存在於測試目的。 真正的 JavaScript 引擎（Node.js、Chrome 以及 DevTools 等）仍然會拋出錯誤。

可以重新聲明 var 是正常的，因為它的范圍不同。 這是讓 ES6 添加的原因之一。 您可以在此處閱讀有關 var 與 let 的更多信息。

Answer 2

您可以將所有代碼括在括號中。

{
let x = 5;
console.log(x);
}

JavaScript 允許您將任何代碼包裝在括號中。 每次運行代碼段時，括號將為您的 let 變量創建一個唯一的 scope。

Answer 3

忽略同一 scope 中同一var變量的多個聲明。 let （以及const ）並非如此，因為同一 scope 中的多個聲明不會被忽略，從而導致第二個聲明失敗。

考慮以下：

var x = 1;
var x = 2;

以及以下內容：

let x = 1;
let x = 2;

在第一個示例中，解釋器將代碼視為：

var x;
x = 1;
x = 2;

由於let關鍵字，秒示例保持不變。

盡管所有變量都在技術上被提升，但它們的評估方式並不相同。 來自https://www.ecma-international.org/ecma-262/9.0/index.html#sec-let-and-const-declarations ：

var 語句聲明了范圍為正在運行的執行上下文的 VariableEnvironment 的變量。 var 變量在它們包含的詞法環境被實例化時創建，並在創建時初始化為 undefined。

含義var聲明在其上下文被實例化后被評估。 但是，只有在達到代碼中的聲明時才會評估let 。