深入理解switch case

switch case语句是我们编程中常用的一个表达式。它的语法如下¹：

switch (expression) {
  case value1:
    // 当 expression 的结果与 value1 匹配时，执行此处语句
    [break;]
  case value2:
    // 当 expression 的结果与 value2 匹配时，执行此处语句
    [break;]
  ...
  case valueN:
    // 当 expression 的结果与 valueN 匹配时，执行此处语句
    [break;]
  [default:
    // 如果 expression 与上面的 value 值都不匹配时，执行此处语句
    [break;]]
}

我们平时基本也就是按照这个语法规则来写switch case。仔细想想里面其实有几个问题值得好好想想。

问题1： 每个case都需要一个break吗？
答： 不是。
详解： 首先搞清楚break的作用是跳出当前这个switch语句，执行switch case之后的代码。看下面一个例子：

switch (color) {
  case "red":
   console.log("red");
   break;
  case "yellow":
    console.log("yellow");
  default:
    console.log("unknown color");
}

如果输入color为red则输出结果:

red

如果输入color为red则输出结果:

yellow
default color

从例子可以明显看出没有break的话则会从条件匹配的 case 语句开始运行，然后不论是否符合条件继续持续执行下一个 case 语句，直到遇到break或者执行完所有case。

但是这并不是说不能这样用，你可以使用这种方法来进行关联操作。

问题2： default必须放在最后吗？
答： 不是。
详解： default就是在所有其他case都不满足条件的情况下执行，不论你放在哪个位置都可以被执行。看下面两个例子：
例子1：

var color = "blue";
switch (color) {
  case "red":
   console.log("red ");
    break;
  case "yellow":
    console.log("yellow");
    break;
  default:
    console.log("unknown color");
}

例子2：

var color = "blue";
switch (color) {
  case "red":
   console.log("red ");
    break;
  default:
    console.log("unknown color");
  case "yellow":
    console.log("yellow");
    break;
}

你认为这两个例子的输出是一样的吗？

其实不一样，例子1的输出为：

unknown color

例子2输出为：

unknown color
yellow

看到这里你应该大概懂了，其实default放在最后的最大好处就是可以省略一个break（结合问题1的解答）。而且default的本意就是在其他条件都不满足的条件下执行，放在最后其实也最便于理解。所以，在平时写代码的时候还是按照惯例乖乖的把default放在最后吧。

问题3： default是必须要有的吗？
答： 不是。
详解： 从语法上来说，default语句就不是必须的。在使用枚举值作为switch参数时，而且case已经列出了所有可能出现的值，此时default语句是不需要的。
但是如果有任何无法被考虑到的情况都应该加入default进行异常处理，否则这时候switch语句不会有任何输出，难以发现出错的地方在哪。

问题4： 每一个case下面可以执行多条语句吗？
答： 当然可以。
详解： 唯一的要求就是所有要执行的语句必须放在这条case分之下的break之前。

问题5： 什么时候使用switch case？什么时候使用if else？
答： 参见另外一篇文章。

---

1. https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Statements/switch ↩︎