JavaScript的switch語句是一種強大的條件分支控制結構,能讓我們根據不同的條件執行不同的代碼塊,使代碼比多個if...else if...else更清晰簡潔。

基本語法

switch (expression) {
  case value1:
    // 當expression === value1時執行的代碼
    break;
  case value2:
    // 當expression === value2時執行的代碼
    break;
  // 可以有任意數量的case
  default:
    // 如果沒有匹配的case,執行的默認代碼
}

核心要點

  1. expression:要進行判斷的表達式
  2. case value:與expression比較的可能值
  3. break:終止switch語句,防止"fall-through"(貫穿執行)
  4. default:可選,當沒有匹配的case時執行

代碼例子

示例1:判斷星期幾

let day = 3; // 假設今天是週三
let dayName;

switch (day) {
  case 1:
    dayName = "星期一";
    break;
  case 2:
    dayName = "星期二";
    break;
  case 3:
    dayName = "星期三";
    break;
  case 4:
    dayName = "星期四";
    break;
  case 5:
    dayName = "星期五";
    break;
  case 6:
    dayName = "星期六";
    break;
  case 7:
    dayName = "星期日";
    break;
  default:
    dayName = "無效的日期";
}

console.log(`今天是${dayName}。`); // 輸出: 今天是星期三。

示例2:多個case共享相同代碼

let fruit = "apple";
let category;

switch (fruit) {
  case "apple":
  case "banana":
  case "orange":
    category = "水果";
    break;
  case "carrot":
  case "broccoli":
    category = "蔬菜";
    break;
  default:
    category = "未知";
}

console.log(`這個${fruit}屬於${category}類。`); // 輸出: 這個apple屬於水果類。

示例3:使用默認分支

let color = "yellow";
switch (color) {
  case "red":
    console.log("這是紅色");
    break;
  case "blue":
    console.log("這是藍色");
    break;
  default:
    console.log("這是未知顏色");
}

// 輸出: 這是未知顏色

示例4:類型很重要(嚴格比較)

let value = "1";
switch (value) {
  case 1:
    console.log("數字1");
    break;
  case "1":
    console.log("字符串1");
    break;
  default:
    console.log("未知");
}

// 輸出: 字符串1

重要注意事項

  1. 嚴格比較switch使用嚴格相等(===)比較,類型和值都必須匹配
  2. break必不可少:忘記break會導致"fall-through"(代碼繼續執行下一個case)
let num = 2;
switch (num) {
  case 1:
    console.log("One");
    break;
  case 2:
    console.log("Two"); // 沒有break,會繼續執行下面的case
  case 3:
    console.log("Three");
    break;
}
// 輸出: Two
//        Three
  1. default可以放在任意位置:雖然通常放在最後,但也可以放在其他位置

為什麼使用switch?

當有多個條件判斷時,switchif...else if...else更簡潔易讀:

// 使用if...else
if (day === 1) {
  dayName = "星期一";
} else if (day === 2) {
  dayName = "星期二";
} else if (day === 3) {
  dayName = "星期三";
} // ... 以此類推

// 使用switch
switch (day) {
  case 1: dayName = "星期一"; break;
  case 2: dayName = "星期二"; break;
  case 3: dayName = "星期三"; break;
  // ... 更簡潔
}