我們都從某個地方開始。 我學習了使用var關鍵字聲明變量的JavaScript。 它很簡單而且有效，但是我已經改變了。

如果您編寫類似var x = 5的代碼，則需要停止。 好吧，老實說，您不必這樣做，但您應該這樣做。

我們經常將編程語言視為刻板的一組規則。 現實情況是，與任何口頭語言一樣，編程語言也在不斷髮展。

現在，我使用關鍵字const並讓我們在JavaScript中聲明所有變量，所以您也應該這樣做。

讓我們學習如何以及為什麼。

顧名思義，變量表示變化的值。 儘管聲明和不接觸變量並不一定有什麼問題，但是如果我們試圖編寫具有語義意義的代碼，則應該區分變量和常量。

常量與變量相反，變量的聲明值不變。 從歷史上看，為定義一個常量，我們使用所有大寫字母，例如有毒動物的鮮豔顏色。

不用依賴約定，引入const關鍵字為我們提供了一個明確的選項，用於聲明哪些內容不會更改。

要使用const關鍵字，只需將其替換為var即可，現在無法修改該值。

// the old way

// var sales_tax = 0.06;

// the new way

const sales_tax = 0.06;

sales_tax = 0.08; // "TypeError: Assignment to constant variable.

實現簡單，原理簡單。 使用const是理所當然的。 但是什麼時候合適呢？

諸如稅率或單位之間的轉換之類的數字比率很容易選擇。 您將看到使用const的另一個地方是使用箭頭符號聲明函數。

const myFunction = (x,y) => {

// Do stuff

}

myFunction(1,2)

現在，您的函數無法覆蓋。

修正JavaScript的古怪範圍

JavaScript缺乏範圍清晰性，這常常導致開發和故障排除的失敗。 以下是JS範圍異常的摘要：

· 可以對變量使用兩次var（重新聲明）

· 默認情況下，頂級變量是全局變量（全局對象）

· 循環中的變量重用了相同的引用（閉包）

使用let可以澄清並解決許多這些奇怪的問題。 讓我們仔細看看。

這很簡單，您無法重新聲明使用let製作的變量。

var x = 0;

let y = 0;

var x = 1;

let y = 1; // "SyntaxError: Identifier 'y' has already been declared

全局對象

在頂層，用var聲明的變量作為屬性添加到全局對象，而let變量則不。

var x = 0;

let y = 0;

console.log(window.x); // 0

console.log(window.y); // undefined

吊裝

用let定義的變量只能在其塊範圍內訪問，而var變量將提升到功能級別。

// Using var

console.log(i); // undefined

for(var i=0; i<4; i++) {

console.log(i);

}

console.log(i); // 4

// Using let

console.log(j); // "ReferenceError: j is not defined

for(let j=0; j<4; j++) {

console.log(j);

}

console.log(j); // "ReferenceError: j is not defined

閉包

這是一個新概念很難理解，但是閉包是引用自由變量的函數。

當我們有一個帶有var變量的閉包時，會記住該引用，當在該變量更改的循環內時，這可能會很麻煩。

var functions = [];

for (var i = 0; i < 3; i++) {

functions[i] = () => { console.log(i); };

}

for (var j = 0; j < 3; j++) {

functions[j]();

}

// 3 3 3

使用let每次都會創建一個新引用。

var functions = [];

for (let i = 0; i < 3; i++) {

functions[i] = () => { console.log(i); };

}

for (var j = 0; j < 3; j++) {

functions[j]();

}

// 0 1 2

最終，即使您並非100％出於這些原因以及它們為何按其工作方式工作，切換到let也將產生更明確的代碼，這些代碼的行為始終如一，並且更易於故障排除/維護。

告誡

儘管let和const應該有效地替換var關鍵字，但生活並不總是那麼簡單。 由於這些關鍵字是在ECMAScript 2015（ES6）中引入的，因此，如果您使用的平臺不允許使用該關鍵字，那麼您就不走運了。 此外，您需要確保採取措施以確保代碼可在目標受眾的瀏覽器中正常運行。

(本文翻譯自Jonathan Hsu的文章《Stop Using 'var' to Declare Variables in JavaScript》，參考：https://levelup.gitconnected.com/stop-using-var-to-declare-variables-in-javascript-6c0caec16f43)

---

---

閱讀更多 聞數起舞 的文章

關鍵字: 聲明 JavaScript 修正你的養生誤區

---