????? 作者簡(jiǎn)介:程序員半夏 , 一名全棧程序員,擅長(zhǎng)使用各種編程語(yǔ)言和框架,如JavaScript、React、Node.js、Java、Python、Django、MySQL等.專注于大前端與后端的硬核干貨分享,同時(shí)是一個(gè)隨緣更新的UP主. 你可以在各個(gè)平臺(tái)找到我!
?? 本文收錄于專欄: 零基礎(chǔ)學(xué)JavaScript,包含JavaScript 基礎(chǔ)知識(shí),DOM相關(guān)知識(shí),高級(jí)知識(shí)點(diǎn),最新ES特性
————————————————————————
?? 熱門專欄:?? 學(xué)透CSS: 全網(wǎng)閱讀超百萬(wàn),CSDN最強(qiáng)CSS專欄,精通CSS全屬性,不做切圖仔,從訂閱本專欄開(kāi)始!
?? SprinbBoot + Vue3 項(xiàng)目實(shí)戰(zhàn): 新鮮出爐的2023實(shí)戰(zhàn)系列博客,配套視頻,用心打磨,篇篇精品.持續(xù)更新,值得訂閱!
JavaScript switch語(yǔ)句用于進(jìn)行決策。
switch語(yǔ)句評(píng)估一個(gè)表達(dá)式,并執(zhí)行與表達(dá)式結(jié)果相匹配的相應(yīng)代碼塊。
switch語(yǔ)句的語(yǔ)法如下:
switch(變量/表達(dá)式) {
case 值1:
// case 1的代碼塊
break;
case 值2:
// case 2的代碼塊
break;
case 值N:
// case N的代碼塊
break;
default:
// default的代碼塊
}
switch語(yǔ)句在括號(hào)()內(nèi)部評(píng)估一個(gè)變量/表達(dá)式。
如果表達(dá)式的結(jié)果等于值1,則執(zhí)行值1對(duì)應(yīng)的代碼塊。
如果表達(dá)式的結(jié)果等于值2,則執(zhí)行值2對(duì)應(yīng)的代碼塊。
這個(gè)過(guò)程會(huì)一直進(jìn)行下去。如果沒(méi)有匹配的case,則執(zhí)行default的代碼塊。
注意:
break語(yǔ)句是可選的。如果遇到break語(yǔ)句,switch語(yǔ)句就會(huì)結(jié)束。
如果不使用break語(yǔ)句,匹配的case之后的代碼塊也會(huì)被執(zhí)行。
default子句也是可選的。
switch語(yǔ)句的流程圖如下:
示例1:使用switch語(yǔ)句的簡(jiǎn)單程序
// 使用switch語(yǔ)句的程序
let a = 2;
switch (a) {
case 1:
a = 'one';
break;
case 2:
a = 'two';
break;
default:
a = 'not found';
break;
}
console.log(`The value is ${a}`);
輸出結(jié)果:
The value is two.
在上面的程序中,表達(dá)式a = 2通過(guò)switch語(yǔ)句進(jìn)行評(píng)估。
表達(dá)式的結(jié)果與case 1不匹配,因此繼續(xù)執(zhí)行第二個(gè)case。在這里,表達(dá)式的結(jié)果與case 2匹配。所以顯示"The value is two"。
break語(yǔ)句終止了代碼塊的執(zhí)行,并將程序的控制流跳轉(zhuǎn)到switch塊的外部。
示例2:使用switch語(yǔ)句進(jìn)行類型檢查
// 使用switch語(yǔ)句的程序
let a = 1;
switch (a) {
case "1":
a = 1;
break;
case 1:
a = 'one';
break;
case 2:
a = 'two';
break;
default:
a = 'not found';
break;
}
console.log(`The value is ${a}`);
輸出結(jié)果:
The value is one.
在上面的程序中,表達(dá)式a = 1通過(guò)switch語(yǔ)句進(jìn)行評(píng)估。
在JavaScript中,switch語(yǔ)句嚴(yán)格檢查值。因此,表達(dá)式的結(jié)果與case “1"不匹配。
然后,switch語(yǔ)句繼續(xù)執(zhí)行第二個(gè)case。在這里,表達(dá)式的結(jié)果與case 1匹配。所以顯示"The value is one”。
break語(yǔ)句終止了代碼塊的執(zhí)行,并將程序的控制流跳轉(zhuǎn)到switch塊的外部。
注意:在JavaScript中,switch語(yǔ)句嚴(yán)格檢查case(應(yīng)該是相同的數(shù)據(jù)類型)與表達(dá)式的結(jié)果。請(qǐng)注意上面的示例中,1與"1"不匹配。
讓我們編寫一個(gè)使用switch語(yǔ)句的簡(jiǎn)單計(jì)算器程序。
示例3:簡(jiǎn)單計(jì)算器
// 簡(jiǎn)單計(jì)算器程序
let result;
// 獲取操作符輸入
const operator = prompt('輸入操作符 +, -, * ,/:');
// 獲取操作數(shù)輸入
const number1 = parseFloat(prompt('輸入第一個(gè)數(shù)字: '));
const number2 = parseFloat(prompt('輸入第二個(gè)數(shù)字: '));
switch(operator) {
case '+':
result = number1 + number2;
console.log(`${number1} + ${number2} = ${result}`);
break;
case '-':
result = number1 - number2;
console.log(`${number1} - ${number2} = ${result}`);
break;
case '*':
result = number1 * number2;
console.log(`${number1} * ${number2} = ${result}`);
break;
case '/':
result = number1 / number2;
console.log(`${number1} / ${number2} = ${result}`);
break;
default:
console.log('非法操作符');
break;
}
輸出結(jié)果:
輸入操作符 +, -, * ,/: +
輸入第一個(gè)數(shù)字: 4
輸入第二個(gè)數(shù)字: 5
4 + 5 = 9
在上面的程序中,用戶被要求輸入+、-、*或/,以及兩個(gè)操作數(shù)。然后,switch語(yǔ)句根據(jù)用戶的輸入執(zhí)行相應(yīng)的代碼塊。
JavaScript switch語(yǔ)句中的多個(gè)case可以被分組以共享相同的代碼。
示例4:帶有多個(gè)case的switch語(yǔ)句
// 多個(gè)case的switch程序
let fruit = 'apple';
switch(fruit) {
case 'apple':
case 'mango':
case 'pineapple':
console.log(`${fruit} is a fruit.`);
break;
default:
console.log(`${fruit} is not a fruit.`);
break;
}
輸出結(jié)果:
apple is a fruit.
在上面的程序中,多個(gè)case被分組。所有分組的case共享相同的代碼。文章來(lái)源:http://www.zghlxwxcb.cn/news/detail-734041.html
如果fruit變量的值為mango或pineapple,則輸出結(jié)果將相同。文章來(lái)源地址http://www.zghlxwxcb.cn/news/detail-734041.html
到了這里,關(guān)于【零基礎(chǔ)學(xué)JS - 14 】javaScript中的switch語(yǔ)句的文章就介紹完了。如果您還想了解更多內(nèi)容,請(qǐng)?jiān)谟疑辖撬阉鱐OY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章,希望大家以后多多支持TOY模板網(wǎng)!