switch

switch

switch语句评估一个表达式,将表达式的值与case子句匹配,并执行与该情况相关联的语句。

语法

switch (expression) { case value1: //Statements executed when the result of expression matches value1 [break;] case value2: //Statements executed when the result of expression matches value2 [break;] ... case valueN: //Statements executed when the result of expression matches valueN [break;] [default: //Statements executed when none of the values match the value of the expression [break;]] }

expression一个用来与 case 子语句匹配的表达式。case valueN可选用于匹配expressioncase子句。如果expression与给定的valueN相匹配,则执行该 case 子句中的语句直到该switch语句结束或遇到一个breakdefault可选一个default子句;如果给定,这条子句会在expression的值与任一case语句均不匹配时执行。

描述

一个 switch 语句首先会计算其 expression 。然后,它将从第一个 case 子句开始直到寻找到一个其表达式值与所输入的 expression 的值所相等的子句(使用严格运算符,===)并将控制权转给该子句,执行相关语句。(如果多个 case 与提供的值匹配,则选择匹配的第一个 case,即使这些 case 彼此间并不相等。)如果没有case子句相匹配,程序则会寻找那个可选的 default 子句,如果找到了,将控制权交给它,执行相关语句。若没有default子句,程序将继续执行直到switch结束。按照惯例,default子句是最后一个子句,不过也不需要这样做。

可选的break语句确保程序立即从相关的 case 子句中跳出 switch 并接着执行 switch 之后的语句。若break被省略,程序会继续执行switch语句中的下一条语句。

示例

使用 switch

下面的例子中,如果expr计算为 "Bananas",程序就会匹配值为 "Bananas" 的 case 然后执行相关语句。当遇到break时,程序就跳出switch然后执行switch后的语句。若break被省略,值为 "Cherries" 的 case 中的语句就也将被执行。

switch (expr) { case 'Oranges': console.log('Oranges are $0.59 a pound.' break; case 'Apples': console.log('Apples are $0.32 a pound.' break; case 'Bananas': console.log('Bananas are $0.48 a pound.' break; case 'Cherries': console.log('Cherries are $3.00 a pound.' break; case 'Mangoes': case 'Papayas': console.log('Mangoes and papayas are $2.79 a pound.' break; default: console.log('Sorry, we are out of ' + expr + '.' } console.log("Is there anything else you'd like?"

如果忘记 break 会怎么样?

如果你忘记添加break,那么代码将会从值所匹配的 case 语句开始运行,然后持续执行下一个 case 语句而不论值是否匹配。实例如下:

var foo = 0; switch (foo) { case -1: console.log('negative 1' break; case 0: // foo is 0 so criteria met here so this block will run console.log(0 // NOTE: the forgotten break would have been here case 1: // no break statement in 'case 0:' so this case will run as well console.log(1 break; // it encounters this break so will not continue into 'case 2:' case 2: console.log(2 break; default: console.log('default' }

我能把 default 放到 case 之间吗?

可以啊!JavaScript 会在它找不到匹配项时跳回到那个 default :

var foo = 5; switch (foo) { case 2:   console.log(2   break; // it encounters this break so will not continue into 'default:'   default:   console.log('default')   // fall-through case 1: console.log('1' }

即使你把 default 放到其它 case 之上它仍会工作。

用 Switch 重写多个 If 语句

如下所示。

var a = 100; var b = NaN; switch (true) {   case isNaN(a) || isNaN(b):   console.log('NaNNaN' break; case a === b:   console.log(0   break;   case a < b:   console.log(-1   break;   default:   console.log(1 }

使用多准则 case 的方法

这个技术来源于此:

Switch statement multiple cases in JavaScript (Stack Overflow)

多 case - 单一操作

这种方法利用这样一个事实:如果 case 语句之下没有 break ,它将继续执行下一个 case 语句,而不管 case 是否符合条件。 请看“如果忘记 break 会怎么样?”部分。

这是一个单操作顺序的 switch 语句,其中四个不同值的执行结果完全一样。

var Animal = 'Giraffe'; switch (Animal) { case 'Cow': case 'Giraffe': case 'Dog': case 'Pig': console.log('This animal will go on Noah\'s Ark.' break; case 'Dinosaur': default: console.log('This animal will not.' }

多 case - 关联操作

这是一个关联操作顺序的 switch 语句,其中,根据所输入的整数,你会得到不同的输出。这表示它将以你放置 case 语句的顺序遍历,并且不必是数字顺序的。在 JavaScript 中,你甚至可以将字符串定义到这些 case 语句里。

var foo = 1; var output = 'Output: '; switch (foo) { case 10: output += 'So '; case 1: output += 'What '; output += 'Is '; case 2: output += 'Your '; case 3: output += 'Name'; case 4: output += '?'; console.log(output break; case 5: output += '!'; console.log(output break; default: console.log('Please pick a number from 0 to 6!' }

这个例子的输出:

ValueLog text
foo is NaN or not 1, 2, 3, 4, 5 or 10Please pick a number from 0 to 6!
10Output: So What Is Your Name?
1Output: What Is Your Name?
2Output: Your Name?
3Output: Name?
4Output: ?
5Output: !

规范

SpecificationStatusComment
ECMAScript 3rd Edition (ECMA-262)StandardInitial definition. Implemented in JavaScript 1.2
ECMAScript 5.1 (ECMA-262)The definition of 'switch statement' in that specification.Standard
ECMAScript 2015 (6th Edition, ECMA-262)The definition of 'switch statement' in that specification.Standard
ECMAScript Latest Draft (ECMA-262)The definition of 'switch statement' in that specification.Living Standard

浏览器兼容性

FeatureChromeEdgeFirefox (Gecko)Internet ExplorerOperaSafari
Basic support(Yes)(Yes)(Yes)(Yes)(Yes)(Yes)

FeatureAndroidChrome for AndroidEdgeFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
Basic support(Yes)(Yes)(Yes)(Yes)(Yes)(Yes)(Yes)