JavaScript - var 開關鍵字

你好，未來的 JavaScript 巫師們！今天，我們將踏上一段令人興奮的旅程，探索 JavaScript 世界中的變量，特別聚焦於 var 開關鍵字。作為你們友好的鄰居計算機老師，我在這裡指導你們掌握這個基本概念，這將成為你們編程冒險的基石。所以，拿起你們的虛擬魔杖（鍵盤），我們一起來深入探討吧！

語法

我們先從基礎開始。在 JavaScript 中，我們使用 var 開關鍵字來聲明變量。把變量想像成神奇的容器，可以存放不同類型的資訊。下面是我們如何創建的：

var magicNumber = 42;
var wizardName = "Merlin";
var isWizard = true;

在這些例子中，我們創建了三個變量：

1. magicNumber 存放一個數字（42）
2. wizardName 存放一個字符串（"Merlin"）
3. isWizard 存放一個布爾值（true）

記住，JavaScript 就像一個有用的助手 - 它不需要你指定你要存儲的數據類型。它會自己找出來！

JavaScript 變量作用域

現在，讓我們來討論一些更進階的內容 - 變量作用域。在 JavaScript 的神奇世界中，變量存在於不同的領域，這些領域被稱為作用域。

全局作用域

當你在任何函數之外聲明一個變量時，它會成為一個全局變量。這就像在霍格沃茨的大廳中宣告一樣 - 每個人都聽得見！

var globalSpell = "Lumos";

function castSpell() {
console.log(globalSpell); // 輸出: "Lumos"
}

castSpell();
console.log(globalSpell); // 輸出: "Lumos"

函數作用域

在函數內部聲明的變量只能在该函數內部訪問。這就像低語一個秘密咒語 - 只有在函數內部的人才能聽到。

function learnSecretSpell() {
var secretSpell = "Alohomora";
console.log(secretSpell); // 輸出: "Alohomora"
}

learnSecretSpell();
console.log(secretSpell); // 錯誤: secretSpell 未定義

JavaScript 變量提升

現在，我們來看看 JavaScript 的一個特別行為 - 提升。想像一下，如果在魁地奇比賽之前，所有的掃帚都飄到了場地的頂部。JavaScript 對 var 聲明做的就是這樣的事情！

console.log(magicWand); // 輸出: undefined
var magicWand = "Elder Wand";

JavaScript 將聲明（但不是初始化）提升到頂部。就像代碼是這樣寫的：

var magicWand;
console.log(magicWand); // 輸出: undefined
magicWand = "Elder Wand";

使用 'var' 開關鍵字重新聲明變量

與一些更严格的编程語言不同，JavaScript 在重新聲明使用 var 定義的變量方面非常寬容。這就像能夠多次無煩無擾地為你的貓頭鵰改名一樣！

var owl = "Hedwig";
console.log(owl); // 輸出: "Hedwig"

var owl = "Errol";
console.log(owl); // 輸出: "Errol"

在單個語句中聲明多個變量

為了節省時間（並防止因為大量打字而導致的手指痙攣），你可以在一次語句中聲明多個變量。這就像一次性施放多個咒語一樣！

var spell1 = "Expelliarmus",
spell2 = "Expecto Patronum",
spell3 = "Wingardium Leviosa";

在循環中使用 'var' 開關鍵字

var 開關鍵字在循環中特別有用。這就像有一個神奇的計數器來跟踪你的咒語：

for (var i = 1; i <= 3; i++) {
console.log("施放咒語 " + i);
}
// 輸出：
// 施放咒語 1
// 施放咒語 2
// 施放咒語 3

但是，請小心！循環變量 i 在循環結束後仍然存在，這可能不是你想要的。

使用解構賦值

最後，我們來看看一種更進階的技術，叫做解構賦值。這就像一次性打開一個滿是魔法物品的箱子：

var [spell, wand, potion] = ["Lumos", "Holly", "Felix Felicis"];
console.log(spell);  // 輸出: "Lumos"
console.log(wand);   // 輸出: "Holly"
console.log(potion); // 輸出: "Felix Felicis"

這讓你從數組中一次性為多個變量賦值。非常神奇，對吧？

現在，讓我們總結一下我們學到的所有方法，並在一個方便的表格中展示：

方法	描述	示例
基礎聲明	聲明一個單一變量	var magicNumber = 42;
全局作用域	聲明一個在任何地方都可訪問的變量	var globalSpell = "Lumos";
函數作用域	在函數內聲明一個只能在函數內訪問的變量	function() { var secretSpell = "Alohomora"; }
提升	變量聲明被移到作用域頂部	console.log(x); var x = 5;
重新聲明	多次聲明同一個變量	var owl = "Hedwig"; var owl = "Errol";
多個聲明	在一個語句中聲明多個變量	var spell1 = "Expelliarmus", spell2 = "Expecto Patronum";
循環聲明	在 for 循環中使用 var	for (var i = 0; i < 5; i++) { ... }
解構賦值	從數組中為多個變量賦值	var [spell, wand] = ["Lumos", "Holly"];

年輕的巫師們，你們剛剛完成了 JavaScript 中 var 開關鍵字的第一課。記住，就像精通任何魔法技能一樣，精通 JavaScript 也需要練習。所以，繼續編程，繼續實驗，最重要的是，繼續享受樂趣！在我們的下一次課堂之前，願你的代碼無 bug，變量永遠正確聲明！

Credits: Image by storyset