變數

大部分時間，JavaScript 應用程式需要處理資訊。以下是兩個範例

1. 線上商店 – 資訊可能包括正在販售的商品和購物車。
2. 聊天應用程式 – 資訊可能包括使用者、訊息，以及更多。

變數用來儲存這些資訊。

變數

一個 變數 是資料的「命名儲存」。我們可以使用變數來儲存商品、訪客，以及其他資料。

要在 JavaScript 中建立變數，請使用 let 關鍵字。

以下陳述建立（換句話說：宣告）一個名為「訊息」的變數

let message;

現在，我們可以使用賦值運算子 = 來放入一些資料

let message;

message = 'Hello'; // store the string 'Hello' in the variable named message

字串現在儲存在與變數相關聯的記憶體區域中。我們可以使用變數名稱來存取

let message;
message = 'Hello!';

alert(message); // shows the variable content

簡而言之，我們可以將變數宣告和賦值合併成單一行

let message = 'Hello!'; // define the variable and assign the value

alert(message); // Hello!

我們也可以在單一行中宣告多個變數

let user = 'John', age = 25, message = 'Hello';

這看起來可能比較簡短，但我們不建議這麼做。為了提高可讀性，請每個變數使用單獨一行。

多行變體比較長，但比較容易閱讀

let user = 'John';
let age = 25;
let message = 'Hello';

有些人也會使用這種多行樣式定義多個變數

let user = 'John',
  age = 25,
  message = 'Hello';

… 甚至使用「逗號優先」樣式

let user = 'John'
  , age = 25
  , message = 'Hello';

技術上來說，所有這些變體都做相同的事。因此，這取決於個人品味和美學觀。

var message = 'Hello';

現實生活類比

如果我們將「變數」想像成一個裝有資料的「盒子」，上面貼著一個獨一無二的貼紙，我們就可以輕易掌握這個概念。

例如，變數 message 可以想像成一個標籤為 "message" 的盒子，裡面裝著值 "Hello!"

我們可以將任何值放入盒子中。

我們也可以隨意變更它

let message;

message = 'Hello!';

message = 'World!'; // value changed

alert(message);

當值變更時，舊資料會從變數中移除

我們也可以宣告兩個變數，並將資料從一個複製到另一個。

let hello = 'Hello world!';

let message;

// copy 'Hello world' from hello into message
message = hello;

// now two variables hold the same data
alert(hello); // Hello world!
alert(message); // Hello world!

let message = "This";

// repeated 'let' leads to an error
let message = "That"; // SyntaxError: 'message' has already been declared

變數命名

JavaScript 中的變數名稱有兩個限制

1. 名稱只能包含字母、數字或符號 $ 和 _。
2. 第一個字元不能是數字。

有效名稱範例

let userName;
let test123;

當名稱包含多個字詞時，通常會使用 駝峰式大小寫。也就是說：字詞一個接一個，除了第一個字詞以外，每個字詞都以大寫字母開頭：myVeryLongName。

有趣的是，美元符號 '$' 和底線 '_' 也可以用於名稱中。它們是常規符號，就像字母一樣，沒有任何特殊含義。

這些名稱有效

let $ = 1; // declared a variable with the name "$"
let _ = 2; // and now a variable with the name "_"

alert($ + _); // 3

不正確變數名稱範例

let 1a; // cannot start with a digit

let my-name; // hyphens '-' aren't allowed in the name

let имя = '...';
let 我 = '...';

let let = 5; // can't name a variable "let", error!
let return = 5; // also can't name it "return", error!

// note: no "use strict" in this example

num = 5; // the variable "num" is created if it didn't exist

alert(num); // 5

"use strict";

num = 5; // error: num is not defined

常數

若要宣告常數（不可變）變數，請使用 const 取代 let

const myBirthday = '18.04.1982';

使用 const 宣告的變數稱為「常數」。它們無法重新指派。嘗試重新指派會造成錯誤

const myBirthday = '18.04.1982';

myBirthday = '01.01.2001'; // error, can't reassign the constant!

當程式設計師確定變數永遠不會變更時，他們可以使用 const 宣告變數，以保證並向所有人傳達此事實。

大寫常數

有一個廣泛的慣例，將常數用作難以記憶的別名，這些值在執行前已知。

此類常數使用大寫字母和底線命名。

例如，讓我們建立所謂「網頁」（十六進位）格式的顏色常數

const COLOR_RED = "#F00";
const COLOR_GREEN = "#0F0";
const COLOR_BLUE = "#00F";
const COLOR_ORANGE = "#FF7F00";

// ...when we need to pick a color
let color = COLOR_ORANGE;
alert(color); // #FF7F00

好處

• COLOR_ORANGE 比 "#FF7F00" 容易記憶得多。
• 輸入 COLOR_ORANGE 比輸入 "#FF7F00" 容易得多。
• 在閱讀程式碼時，COLOR_ORANGE 比 #FF7F00 有意義得多。

我們什麼時候應該對常數使用大寫，什麼時候應該正常命名？讓我們釐清這一點。

成為「常數」僅表示變數的值永遠不會變更。但有些常數在執行前已知（例如紅色的十六進位值），而有些常數會在執行期間的執行時間計算，但在初始指派後不會變更。

例如

const pageLoadTime = /* time taken by a webpage to load */;

pageLoadTime 的值在頁面載入前未知，因此以正常方式命名。但它仍然是一個常數，因為它在指派後不會變更。

換句話說，大寫命名的常數僅用作「硬編碼」值的別名。

正確命名

在討論變數時，還有一件非常重要的事情。

變數名稱應具有明確且顯而易見的意義，描述它所儲存的資料。

變數命名是程式設計中最重要的複雜技能之一。只要看一眼變數名稱，就能看出哪些程式碼是由初學者編寫的，哪些程式碼是由經驗豐富的開發人員編寫的。

在實際專案中，大部分時間都花在修改和擴充現有的程式碼庫，而不是從頭開始撰寫完全不同的內容。當我們在做其他事情一段時間後回到某些程式碼時，找到標籤良好的資訊會容易得多。或者換句話說，當變數具有良好的名稱時。

在宣告變數之前，請花點時間思考一個正確的名稱。這麼做將會帶來豐厚的回報。

以下是一些值得遵循的規則

• 使用人類可讀的名稱，例如 userName 或 shoppingCart。
• 遠離縮寫或短名稱，例如 a、b 和 c，除非你知道自己在做什麼。
• 讓名稱盡可能具有描述性且簡潔。不良名稱的範例為 data 和 value。此類名稱毫無意義。僅當程式碼的內容讓變數所引用的資料或值顯而易見時，才可以使用它們。
• 在團隊內部和你的腦海中就術語達成共識。如果網站訪客稱為「使用者」，那麼我們應該將相關變數命名為 currentUser 或 newUser，而不是 currentVisitor 或 newManInTown。

聽起來很簡單？的確如此，但實際上建立具有描述性和簡潔性的變數名稱並不容易。努力去做吧。

摘要

我們可以使用 var、let 或 const 關鍵字來宣告變數以儲存資料。

• let – 是現代的變數宣告。
• var – 是舊式的變數宣告。我們通常完全不使用它，但我們將在〈舊式的「var」〉章節中說明它與 let 之間的細微差異，以防你需要。
• const – 與 let 類似，但變數的值無法變更。

變數應以能讓我們輕易了解其內部內容的方式來命名。