iT邦幫忙

2022 iThome 鐵人賽

DAY 10
0

本篇內容包含:

  • switch
  • 三元運算

switch

當開始編寫越來越多條件句時,可能會使程式十分冗長,這時候可以使用switch讓程式減短易懂

先放一個switchMDN上的語法介紹:

switch (expression) {
  case value1:
        //當 expression 的值符合 value1
        //要執行的陳述句
    [break;]
  case value2:
        //當 expression 的值符合 value2
        //要執行的陳述句
    [break;]
  ...
  case valueN:
        //當 expression 的值符合 valueN
        //要執行的陳述句
    [break;]
  [default:
        //當 expression 的值都不符合上述條件
        //要執行的陳述句
    [break;]]
}

複習一下else if的語法

//使用else if寫法
let todayWeather = "晴天";
if(todayWeather=="毛毛雨"){
	console.log("我就帶雨衣出門");
}else if(todayWeather=="大雨"){
	console.log("我就帶雨傘出門");
}else if(todayWeather=="暴雨"{
	console.log("我就要穿雨鞋帶雨傘");
}else if(todayWeather=="龍捲風"{
	console.log("我可能沒辦法出門");
}else{
	console.log("我不用帶雨具出門");
}

以上內容包括else有5個條件句,若改用switch可以這麼寫

// 使用switch寫法
let todayWeather = "晴天";
switch(todayWeather){
	case "毛毛雨":
		console.log("我就帶雨衣出門");
		break;
	case "大雨":
		console.log("我就帶雨傘出門");
		break;
	case "暴雨":
		console.log("我就要穿雨鞋帶雨傘");
		break;
	case "龍捲風":
		console.log("我可能沒辦法出門");
		break;
	default:
		console.log("我不用帶雨具出門");
		break;
}
  • switch中可以是運算式、值、變數,像上方舉例就是一個變數
  • case進行判斷,最後當所有case都為false時則是使用default運行
  • break指令,用來中斷聲明,當 JavaScript 執行到 break 這個關鍵字的時後,就會直接跳出整個 switch 區塊,繼續往下執行,而如果沒有 break 則程式會從符合的 case區塊開始,一路往下執行到遇到 break 為止!

三元運算子

又稱條件運算子,可透過簡短的方式陳述if…else

condition 條件 ? exprIfTrue條件為真執行此內容 : exprIfFalse條件為否執行此內容

再複習一次if...else...

//if...else...
let myWeight = 40;
if (myWeight> 40){
	console.log("不能吃月餅");
}else{
	console.log("再吃一顆月餅");
} // 再吃一顆月餅

同樣的內容使用三元運算子,簡短超級多~

let myWeight = 40;
let eatMooncake=(myWeight> 40)? "不能吃月餅":"再吃一顆月餅";
// 若myWeight> 40為true"不能吃月餅",若為false"再吃一顆月餅"
console.log(eatMooncake);
//月餅好好吃d(`・∀・)b

最近發現文章內容易有一些打錯字、圖片放錯位置的低級錯誤,也謝謝大家幫我糾正,我會更仔細的(♡˙︶˙♡)
以上為本篇關於switch、三元運算敘述的語法,若有問題歡迎指教~


上一篇
【Day9】流程敘述-流程圖、if、else、else if
下一篇
【Day11】迴圈while、for
系列文
喜歡打程式嗎?從JavaScript基礎來進行興趣初探!30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

1 則留言

0
小哈片刻
iT邦研究生 5 級 ‧ 2022-09-14 09:52:55

講得很親民易懂~

Yumy iT邦新手 4 級 ‧ 2022-09-14 10:07:46 檢舉

感謝(・ω・)~♥

我要留言

立即登入留言