昨天講解了流程控制的if...else (如果符合條件的話，就執行以下程式碼)，今天要講的是流程控制中的 switch 語法。可以把 switch 當作是選擇題的概念，假如使用者選擇的值是 A，就執行 A 區域的程式碼；使用者都不選的話，就執行 default 區域的程式碼。

switch 語法

switch (expression) {
  case value_1:
    // statements_1
    [break;]
  case value_n:
    // statements_n
    [break;]
  [default:
    statements_def
    [break;]]
}

用[]包住代表可寫可不寫，所以break;和default:那段都不是必須的。

• expression (表達式)
  expression 的語法會先被執行，而執行 expression 後得到的值會去跟每個 case 的 value 去比對。
• value (對應表達式的值)
  value 可以有無限多種，如果 value 和 expression 相同的話就會執行該 value 對應的 case 區塊程式碼。
• break
  break 的功能是跳出該流程控制，忘記加 break 雖然不會跳出錯誤訊息，但是會導致程式找到符合條件的 case 後，除了執行該 case 對應的動作外，其他不符合條件的 case 對應的指令也會跟著被執行。

印出資料的另一種方法 - console.log

在提供 switch 語法的實際範例之前須要先學會用 console.log 印出程式執行結果。之前都用 alert() 建立一個彈出視窗，雖然乍看之下很方便，但當要輸出的結果不止一個時，就要按好幾次確認鍵才能顯示完全部的結果。使用 console.log 印出的結果要在 Chrome 瀏覽器中按下 F12 後選擇 Console 才會看到：

假設要印出多種結果（alert() V.S. console.log）：

使用 alert() 要一直按確認才會顯示下個結果

使用 console.log 什麼都不用按就能顯示全部結果，高下立判

switch 語法實例

switch ('100塊') {
    case '100塊':
		console.log('給100塊現金');
        break;
    case '神秘小禮物':
        console.log('給一包衛生紙');
        break;
    default:
        console.log('都不選');
}

由於 expression 的值是100塊，對應到第一個 case 的 value(100塊)，所以會印出給100塊現金：

忘記加 break 會怎樣?

如果上面的範例不幸忘記加 break ，會發生這樣的結果:

全部 case 的結果通通被印出來了！也就是說如果忘記加 break 的話從符合 value 的 case 區塊以下的指令通通都會被執行喔！