iT邦幫忙

DAY 5
0

JavaScript學習路系列 第 5

JavaScript學習路-(05)switch...case

生活中免不了會遇到選擇,當然程式中也會。
使用之前寫過的 if...else 可以達成選擇的目標,但是只限於兩樣事物二選一的時候,看看以下例子:

if ( condition1 ) {
Do someting;
} else if ( condition2 ) {
Do something2;
} else if ( condition3 ) {
Do something3;
} else if ( condition4 ) {
Do something4;
} else if ( condition5 ) {
Do something5;
} else if ( condition6 ) {
Do something6;
} else if ( condition7 ) {
Do something7;
} else if ( condition8 ) {
Do something8;

.......
要選個答案都得經過 Boolean ,如果答案在最後一個呢?
看起來是不是有種沒完沒了的感覺呢?
因此,switch...case 就派上用場啦!
switch...case 是一段能在多樣事物中選擇一個的語法,但跟 if...else 不同的是:
switch... case 不是利用 Boolean 運算做決定,只是單純驗證資料是否符合。

switch (theData) {
case MatchOne:
MatchOneStatement;
break;
case MatchTwo:
MatchTwoStatement;
break;
case MatchThree:
MatchThreeStatement;
break;
......
default:
DefaultStatement;
break;
}

theData = 預檢測的資料,要用()框起來。
再來是檢測資料( case 後記得加上分號):
當 MatchOne 符合的時候,就執行 MatchOneStatement ,執行完畢就 break;
(跳出,離開 switch...case )...以下皆同。
當遇到以上情況都不符合的時候,則執行 default ,也就是是先預設的敘述。
考卷選擇題也會有以上皆非的選項,以上皆非就等於是 default 囉!

可以不加 break; 嗎?也是可以,不過會變成這樣:
當 MatchOne 符合的時候,就執行 MatchOneStatement ,執行完畢再看 MatchTwo 是否符合? MatchThree 是否符合?...怎麼又是沒完沒了的樣子呢?因此,除非有特殊用途,還是記得加上 break; 喔!

本文同步發表於 http://azzurro.blog.aznc.cc/learn_javascript_05/

p.s..發文界面突然出現一條測試輔助線,一時間沒看清楚以為我的螢幕壞了....orz


上一篇
JavaScript學習路-(04)if...else
下一篇
JavaScript學習路-(06)loop-1
系列文
JavaScript學習路30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言