[快速入门前端 45] JavaScript：条件判断 (2) switch 语句

switch 语句

当条件式选项很多时使用 if-else 会很繁杂，这时候就可以考虑使用 switch 语句。
在 switch 中，括号内的表达式会依次和 case 的值 (或表达式) 进行比较，若完全相等则会执行 case 后的程式，而若所有 case 都不满足则会进入 default (像 if-else 中 else 的概念)。

语法：

switch ( 表达式 ) {case 值一:执行程式break;case 值二:执行程式break;case 值三:执行程式break;default:执行程式}

範例：
在大部分情况下其实 if-else 和 switch 的功能是类似的，下面我们分别用两种方法实现数字转换星期。

// if-else// 数次 1、2、3、4、5 分别代表星期一、二、三、四、五，若其他数字则为假日，不考虑数字不合理的情况。let num = 3if (num == 1) {    console.log("星期一");}else if (num == 2) {    console.log("星期二")}else if (num == 3) {    console.log("星期三");}else if (num == 4) {    console.log("星期四");}else if (num == 5) {    console.log("星期五");}else {    console.log("假日到了");}// switchlet num = 2;switch (num) {    case 1:        console.log("礼拜一");        break;    case 2:        console.log("礼拜二");        break;    case 3:        console.log("礼拜三");        break;    case 4:        console.log("礼拜四");        break;    case 5:        console.log("礼拜五");        break;    default:        console.log("放假了");}

Switch 的延伸

我们知道 switch 决定是否要执行 case 后的程式是透过判断 「switch 括号中的表达式与 case 的值是否相同」来决定的，上面的範例都是单一值，也就是「当变数等于 1 时 ...」、「当变数等于 2 时 ...」，但若我们想将一个範围区间作为条件依据，例如条件为「变数大于 60」、「变数小于50」时又要怎么使 switch 和 case 表达式的值相等呢？
其实只需要换种思考将 switch 表达式写成 switch(true) ，这样 case 就可以写任何表达式，只要为 true 就会成功执行。

範例：
依照成绩输出相应的文字。

let score = 60;switch (true) { // 将 switch 表达式设定为 true，所以 case 值只要最终为 true 就会与 switch 相同    case score >= 90: // score 为 60，此表达式为 false，与 switch 不同，不执行        console.log("成绩超好");        break;    case score >= 75: // score 为 60，此表达式为 false，与 switch 不同，不执行        console.log("还可以啦");        break;    case score >= 60: // score 为 60，此表达式为 true，与 switch 相同，执行        console.log("及格了");        break;    default:        console.log("不及格");}

Switch 中的 break

switch (表达式) {    case 条件一:        程式段落一        break;    case 条件二:        程式段落二        break;    default:        default 执行程式}

在 switch 中，我们会在每个 case 所需执行的程式最后加一个 break，而它的作用是使程式跳出整个 switch 区块继续往下执行其他的程式。在上段示意中，若条件一与表达式完全相等，则会执行程式段落一，直到出现 break 跳出整段程式。

若没有 break 会发生什么事呢？让我们来看看範例：

let day = ;switch (day) {    case 1:         console.log("星期一");    case 2:         console.log("星期二");    case 3:        console.log("星期三");    default:        console.log("不是星期一、二、三");}

我们可以看到原本应该只输出「星期二」，却连后面的「星期三」和 default 也一起执行了。这是因为若没有使用 break 跳出 switch，则程式会一路往下执行到整个区块结束。

上一篇：[快速入门前端 44] JavaScript：条件判断 (1) if-else 语句
下一篇：[快速入门前端 46] JavaScript：迴圈 (1) for 、while、do while 简介
系列文章列表：[快速入门前端] 系列文章索引列表