JavaScript 變數的核心概念：綁定（Binding）

By徐培鈞
LinkedIn

更新日期： 2025 年 4 月 22 日

在寫程式時，我們常常會遇到一個問題：資料產生出來之後，要怎麼保留下來供之後使用？又該怎麼取回它？

如果沒有辦法記住它，程式每執行一次都會像失憶一樣，一切重頭再來。

這時候，「變數」就派上用場了。

但其實，更準確的說法是：程式透過「綁定（binding）」來保存資料的狀態。

這篇文章將帶你了解什麼是綁定、如何使用 JavaScript 的變數，並建立起正確的理解模型。

什麼是綁定（Binding）？

在 JavaScript 中，如果你想要讓某個值「被記住」、未來還能夠被重複使用，你就需要建立一個綁定（binding）。

所謂綁定，就是給某個資料一個「名字」，然後透過這個名字去抓取或操作它。這個名字就像是你放置資料的「標籤」或「代號」，你可以想像它像一雙手，把值緊緊抓住。

綁定的語法

在 JavaScript 裡，建立綁定最常見的方式是使用 let、const 或 var 關鍵字。以下是一個例子：

let caught = 5 * 5;

這句話做了三件事：

  1. 使用 let 關鍵字宣告一個綁定；
  2. 指定這個綁定的名稱為 caught；
  3. 計算 5 * 5，然後把結果（25）與這個名稱「綁」在一起。

簡單來說，caught 就是我們這雙手，而 25 是它目前握住的東西。

從現在開始，在這段程式中只要提到 caught，其實就是在提到 25。

小知識：這是「陳述式」，不是「表達式」

let caught = 5 * 5;

這不是單純的一個運算或結果，而是一種行為：它改變了程式的內部狀態（創造了一個新的綁定）。這種語句被稱為「陳述式（statement）」，與單純會回傳值的「表達式（expression）」不同。

例如：

5 * 5   // 是一個表達式，會產生一個值（25）
let x = 25   // 是一個陳述式，它創造了綁定 x，並抓住 25

綁定不是倉庫，而是便條紙 + 迴紋針

有些教學會把變數比喻成「盒子裝資料」，但這樣會讓人誤以為資料是存在變數「裡面」的。

實際上，綁定更像是用便條紙寫上名字，然後用迴紋針夾在某份資料上。

你可以把便條紙夾到別的資料上（重新指定值），便條紙還是原來那張，資料也還是原來的資料，只是「連結」換了。

綁定可以再利用

當你使用 let 建立一個綁定後，這個名字就會成為程式的一部分。

只要在有效範圍內（也就是該綁定仍然「活著」的地方），你就可以透過這個名字重複使用、存取它所綁定的值。

範例說明：

let ten = 10;
console.log(ten * ten); // → 100

在這段程式中，let ten = 10 表示：我們建立一個名為 ten 的綁定，並將數字 10 指定給它。

接著，我們在 console.log(ten * ten) 中使用了這個綁定名稱兩次。

JavaScript 引擎會透過 ten 去查找目前這個綁定抓住的是什麼資料，並發現是數字 10，於是會代入運算，結果就是 100。

綁定是動態的，不是靜態的

有些人剛開始學程式時會以為「一旦你綁定了一個值，它就永遠固定不變了」，但這是一個常見的誤解。

事實上，綁定是可以「重新指向」的。你可以在程式後續的任意時刻，讓綁定脫離原本的值，去抓住一個新的值。

🧪 範例說明：

let mood = "light";
console.log(mood); // → light

mood = "dark";
console.log(mood); // → dark

這裡的 mood 一開始綁定的是字串 "light"，我們之後使用 mood = "dark" 這個賦值語句，讓 mood 改抓 "dark"，這個動作就像是把「鉤子」移到別的資料上。

這種特性讓程式能夠根據使用者操作、資料更新等情況，動態改變行為與顯示結果。

舉例來說，你的網頁主題從亮色模式切換到暗色模式，就是這種動態綁定的應用。

結語

理解「綁定」的概念，能幫助你更深入掌握 JavaScript 的變數與記憶方式。

當你在寫下 let a = 3，不是單純在「建立變數」，而是在建立一個對資料的抓取連結。

學會這個觀念之後，未來你學到「參考型資料」、「物件指向」等進階主題時，會輕鬆許多！

Similar Posts