switch 敘述 在

關於 switch 敘述

一般語法

除了 if敘述之外，JavaScript 也有 switch敘述，可以依照條件執行不同的邏輯。 當單一變數需要和多個選項比較時，就會用到它。 比較的方式是檢查嚴格相等（===），詳見比較概念。 對於某個變數x，JavaScript 中的switch敘述語法如下。

switch (x) {
  case option1:
    // code that is executed when "x === option1" is true
    break;
  case option2:
    // code that is executed when "x === option2" is true
    break;
  default:
    // code that is executed when x does not equal any of the
    // options
}

default分支是選用的，當其他選項都不符合這個變數，而你仍想執行某些程式碼時，就可以使用它。

預設會穿透

上面會用到break敘述，是因為在 JavaScript 中所有分支預設都會「穿透」。 也就是說，如果沒有任何break敘述，第一個符合的選項底下所有分支的程式碼都會被執行，即使x並不符合那些選項。 這種「預設會穿透」的行為，是使用 JavaScript 的switch時常見的陷阱。 在函式內，也可以改用return取代break來避免這個問題。

當你想讓多個分支套用同一段程式碼時，可以善用穿透的特性。 你可以在MDN 文件找到相關範例。

作用域

預設情況下，不同case分支中的變數會共用同一個作用域。 這可能會導致意想不到的行為。 舉例來說，因為複製貼上某個分支，你可能會在兩個分支裡都出現let message宣告，因而產生錯誤，詳見MDN 文件。 若要避免共用作用域造成的問題，你可以為每個case分支加上用大括號包起來的程式區塊，替每個分支建立獨立的作用域。

switch (x) {
  case option1: {
    // Variables declared here are contained to this case.
    break;
  }
  case option2: {
    // ...
    break;
  }
  default: {
    // ...
  }
}

使用運算式

除了變數x之外，你也可以使用運算式。 運算式會在switch敘述開頭求值一次，再把結果和各個分支比較。 常見的用法是「型別切換」，依照變數的型別執行不同的程式碼。

switch (typeof x) {
  case 'string':
    // code that is executed when x is a string
    break;
  case 'number':
    // code that is executed when x is a number
    break;
  default:
    // code that is executed when x has some other type
}

這些選項也可以是運算式。