整合營銷服務(wù)商
電腦端+手機(jī)端+微信端=數(shù)據(jù)同步管理
免費(fèi)咨詢熱線：
電腦端+手機(jī)端+微信端=數(shù)據(jù)同步管理
免費(fèi)咨詢熱線：
avaScript語言中的條件語句，除了if 語句，還有switch 語句。switch 常用于根據(jù)不同的條件執(zhí)行不同的操作。雖然它和 if 語句都是用來判斷條件的語句，但是它們之間還是有不同。
語法如下所示：
switch(expression) {
case 變量x:
// 語句1代碼塊
case 變量y:
// 語句2代碼塊
case 變量z:
// 語句3代碼塊
break;
default:
// 代碼塊
}
語法解釋：表達(dá)式值計(jì)算一次，然后我們依次將表達(dá)式的值與每一種 case 情況的值進(jìn)行比較，如果匹配，就會執(zhí)行與 case 對應(yīng)的相關(guān)代碼塊。
執(zhí)行原理：變量 expression 的值與 case 的值進(jìn)行比較，比如變量 expression 等于 case 變量 x，我們就執(zhí)行語句1的代碼塊，如果變量 expression 等于 case 變量 y 就執(zhí)行語句2的代碼塊，依次類推，如果都不符合就執(zhí)行 default 語句代碼塊。break 語言用于結(jié)束當(dāng)前執(zhí)行的語句，default 表示默認(rèn)的，在沒有符合選項(xiàng)的時候默認(rèn)選擇。
示例：
使用 switch 語句來看判斷今天是星期幾，并輸出對應(yīng)時間。例如在一個 HTML 文件中，寫入下列代碼：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>JS_俠課島(9xkd.com)</title>
</head>
<body>
<div>
<p id="date"></p>
</div>
<script>
var day;
var d = new Date().getDay();
switch(d) {
case 0:
day = "星期天";
break;
case 1:
day = "星期一";
break;
case 2:
day = "星期二";
break;
case 3:
day = "星期三";
break;
case 4:
day = "星期四";
break;
case 5:
day = "星期五";
break;
case 6:
day = "星期六";
break;
case 7:
day = "星期天";
break;
}
document.getElementById("date").innerHTML = day;
</script>
</body>
</html>
在瀏覽器中打開這個HTML文件，頁面會顯示：
星期二我們來分析一下 <script> 標(biāo)簽中的 JavaScript 代碼，變量 d 是我們獲取到的當(dāng)天的星期天數(shù)（我寫這個文章的時候是星期二），getDay() 方法會返回與星期相對應(yīng)的數(shù)字，例如星期一返回1、星期二返回2，以此類推。
然后我們將這個變量 d 作為switch 語句的表達(dá)式值，將它與 case 后面的值匹配，如果表達(dá)式等于某個 case 后面的值，則執(zhí)行響應(yīng)的代碼。例如上述代碼中，變量 d 的值為2，那么就會匹配到 case 2，所對應(yīng)的代碼就是day = "星期二";，所以輸出結(jié)果為星期二。后面還有一個break 語句，這個語句的作用就是跳出 switch 語句，避免同時執(zhí)行多個case。
default 關(guān)鍵詞規(guī)定 case 匹配不存在時所做的事情。
示例：
例如我們看下面這段代碼：
var level = "P";
switch(level){
case "A":
console.log("第一類");
break;
case "B":
console.log("第二類");
break;
case "C":
console.log("第三類");
break;
case "D":
console.log("第四類");
break;
default:
console.log("其他");
}
輸出：
其他
上述代碼中，如果 level 的值不滿足任何 case 的值，則會匹配到 default。代碼中 level 的值為 P，而 case 語句中的值只有A、B、C、D，此時就會匹配到 default 語句，執(zhí)行 default 語句下面的代碼。
break 關(guān)鍵詞用于跳出 switch 代碼塊。使用 break 能夠節(jié)省大量執(zhí)行時間，因?yàn)樗鼤雎?switch 代碼塊中的其他代碼的執(zhí)行。
關(guān)于條件分支 switch 和 if 兩者之間的區(qū)別和關(guān)聯(lián)，我們可以通過下面這個表格進(jìn)行簡單直觀的認(rèn)識：
注意一般能用 switch 語句實(shí)現(xiàn)的就一定能使用 if 語句來實(shí)現(xiàn)，但是反過來卻是不一定的，如果區(qū)間范圍就采用 if，如果等值判斷就使用 switch。
效率問題：
多程序都具有switch語句，用于作為菜單功能。當(dāng)傳入的參數(shù)的值等于菜單選項(xiàng)將會執(zhí)行菜單選項(xiàng)中的內(nèi)容，但是JavaScript語言具有特殊性有三等（===）和兩等（==）兩種情況，對于JavaScript來說switch使用的是三等呢，還是兩等呢？我們以下面這段程序來進(jìn)行闡述。
<!DOCTYPE html>
<html>
<head>
<title>簡單的switch的使用</title>
<meta charset="utf-8">
</head>
<body>
<script>
var a="1";
var b=2;
function foo(){
switch(a){
case 1:{
console.log("number 1");
break;
}
case 2:{
console.log("number 2");
break;
}
case "1":{
console.log("string 1");
break;
}
case (function(){return "2"})():{
console.log("value is true");
break;
}
default:{
console.log("not match");
break;
}
}
}
foo();
</script>
</body>
</html>這段程序定義了一個變量其參數(shù)自為字符串型的'1'，菜單選項(xiàng)中有數(shù)字型的選項(xiàng)1和2還有字符串型的參數(shù)“1”還有一個變量的表達(dá)式以及一個默認(rèn)的參數(shù)選項(xiàng)。
直接運(yùn)行這段程序輸出的結(jié)果是string 1。
當(dāng)修改a的值為字符串“2”時輸出的結(jié)果為value is true。
由上述可以switch的菜單選項(xiàng)使用的是三等需要參數(shù)值和參數(shù)類型都相等才會執(zhí)行菜單選項(xiàng)中的值，同時如果菜單選項(xiàng)為一個表達(dá)式如果表達(dá)式返回的結(jié)果和傳入的選項(xiàng)的值相等將會執(zhí)行表達(dá)式后面選項(xiàng)的程序。所以綜上所述switch語句如果菜單語句是表達(dá)式如果表達(dá)式的值為真將會執(zhí)行菜單語句中的內(nèi)容，如果是參數(shù)值如果傳入的值的值與菜單中的值是三等則會執(zhí)行菜單語句中的內(nèi)容。
witch語句幾乎是任何一個編程任務(wù)里不可缺少的一部分。在本文中，你將學(xué)到如何更好的使用switch，并希望你能知道如何情況下我就需要用到它幫我們更好的解決問題。
何時使用switch其實(shí)有個明顯的標(biāo)志—當(dāng)你連續(xù)書寫了多個if/else語句的時候。下面舉例讓我們看看使用if/else的情況，對比一下我們使用switch語句來完成同樣功能。
使用if/else語法非常的冗長，包含了很多不必要的重復(fù)代碼。switch語法則不這樣：
可以看出代碼量會有所減少，并且非常清晰易懂。這是因?yàn)閟witch語法強(qiáng)調(diào)的點(diǎn)在于對象要去比較可能出現(xiàn)的值，而if/else重點(diǎn)在于條件結(jié)果的值。
當(dāng)JavaScript遍歷整個case分支時，你最好使用break語句來阻斷它。避免匹配上了非預(yù)料的、不合適的條件，執(zhí)行了錯誤的結(jié)果。同樣也能幫助引擎過濾掉不必執(zhí)行的額外代碼。
在這個例子中，break語句實(shí)際上不會起任何作用。例如：如果走case 2分支的情況，那么絕對不會走case 5分支。所以這里break有點(diǎn)點(diǎn)多余。是否嚴(yán)格使用break語句的用法有點(diǎn)像是否在表達(dá)式末尾使用分號(;)結(jié)束一樣，各個開發(fā)者都有自己的選擇。有些開發(fā)人員在所有case中使用break，有些則策略性的使用break。全面的使用會帶來一點(diǎn)點(diǎn)性能損失。然而，因?yàn)榫退闳绻麤]有機(jī)會會走其他case分支，至少這樣寫不會讓解析引擎走遍所有switch語句。
有些情況你想讓你的cases能夠’fall through’。這時候使用break更像是一種策略，而不是一種安全措施。
在這個例子中，cases是‘falling through’，break用于顯式的提前退出switch。它表示你將幾個case的條件合并在一起，得到用一個結(jié)果。
如果使用if/else的版本，會使用許多||邏輯判斷，看起來不是特別易懂：
Switch的另外一個特性是能夠處理未知的case或一般需要處理的case。回到 我們第一個例子中來，我們使用default來實(shí)現(xiàn)錯誤處理：
你可能注意到了default被加在了最頂部。不用擔(dān)心！它可以和你期望的那樣work。因?yàn)镴avaScript將遍歷所有case分支后才會處理default。
你同樣能使用default來處理一般情況的case：
它確保了就算switch語句中沒有匹配到任何你定義的case，也能得到一個有用的值。
在你需要寫多個if/else語句代碼塊時，switch語句是一個非常優(yōu)雅的替代方式。即使你可能不像使用for循環(huán)那樣頻繁的使用switch，但在你需要的時候沒有替代品。如今，像lodash和redux這樣的現(xiàn)代庫仍然使用switch。所以更多的在你的JavaScript代碼中使用switch吧！如果你覺得這篇文章對你有幫助，請關(guān)注我們前端小號頭條號！~謝謝
*請認(rèn)真填寫需求信息，我們會在24小時內(nèi)與您取得聯(lián)系。
