走进javascript——解开switch之谜

很早以前就觉得switch很怪异，或者说一直没太理解它，它怪异就怪异在非要给每个语句加上break;不然后面的语句就算不符合条件还是会执行，比如以下这段代码

var num = 2;

switch(num){
  case 1:
    console.log(1);
  case 2:
    console.log(2);
  case 3:
    console.log(3);
  case 4:
    console.log(4);
}

执行效果如下

明明只有2才符合条件，但3跟4也被执行了，然后查教程说要加上break，后来代码就成了下面这个样子

var num = 2;

switch(num){
  case 1:
    console.log(1);
    break;
  case 2:
    console.log(2);
    break;
  case 3:
    console.log(3);
    break;
  case 4:
    console.log(4);
    break;
}

写过若干个switch语句以后，心里不由产生一种情绪，switch太TM难用了，明明很简单，非要让人多写一个break;还不如用if来判断，不知道这是不是很多人都有的想法，反正在之前我是这么想的。

写的代码越多，就越觉得这太不对劲了，于是在想，如果每个语句都要写break;那么解析器直接帮忙写上就好了，可现实是，解析器并没有这么干。在某一个瞬间，产生了一个想法，这个switch肯定还有我所不知道的东西，于是带着这种心情在网上各种查，终于在某一个瞬间，找到了一丝曙光。

不知道你有没有一种感觉哈，写switch特别难用，当然这是有前提的，那就是你对switch不了解。说它难用不仅仅只是说每次要加break，在if中，我们判断某个值如果等于2或者3的时候，我们可以下面这样写

var num = 3;

if(num===2||num===3){
  console.log(true);
}

但如果要你在switch中实现这样的一个功能，可能会令你无从下手。

以上都是瞎说——，因为switch是可以实现这些功能的，之所以我们会觉得不能实现是因为它的这种实现方式，太容易让人误解了，并且如果你不往那方面去想，很难发现它的用处。

下面是一个用switch实现的判断num=2或=3的例子

var num = 2;

switch(num){
  case 1:
    console.log(1);
    break;
  case 2:
  case 3:
    console.log(2 + "或" + 3);
    break;
  case 4:
    console.log(4);
    break;
}

输出如下

这个case是一个入口，当某个值相匹配时，就会去执行相应的代码块，并且如果没有加break的话，后面的值不管是否匹配都会被执行直到遇见break将跳出switch语句，而以上的这段代码就是利用的这一点，我们在这里并没有给2的值加break;因此当值等于2的时候，还会接着往下执行，但在3中有一个break，因此执行完3就会被跳出。如果值为3则直接执行3代码块，接着跳出。

也就是说，之前我所认为的怪异，它是合理的，只是这些东西，没有被我所发现。

如果想在switch中实现判断，诸如1>2，则可以使用下面的这种方式来实现

var num = 2;

switch(true){
  case num>1:
    console.log("num>1");
    break;
  case num<1:
    console.log("num<1");
    break;
}

在switch中做判断的时候，需要注意一点，它用的是全等=而非，比如下面这段代码

var num = "1";

switch(num){
  case 1:
    console.log(1);
    break;
  case 2:
    console.log(2);
    break;
}

它并没有输出1，因为在switch中默认使用的是全等，因此它不会进行隐式转换。

如果你想实现隐式转换，可以用下面这种方式来实现。

var num = "1";

switch(true){
  case num==1:
    console.log(1);
    break;
  case num==2:
    console.log(2);
    break;
}

输出如下

这个true究竟是个什么...，这是你的第一反应？

之所以会有这种感觉，是因为我们对switch一直都存在着一些误解，而且这种误解很深很深，反正我从学编程以来就一直没有理解这个switch，开始是它才过于基础，导致很多人都不愿意去研究它。

为了解开这个switch之谜，我从重对它做一次讲解，用代码来讲把。

switch(x){
  case n:
    .....
    break;
}

其中的x代表某一个值，而case中的n如果和x一模一样则会被执行，注意是一模一样，举个例子

(x = 5) 5  (n = x==5) true   因为5!==true所以不会被执行

具体代码

var num = 5;
switch(num){
  case num==5:
    console.log(num);
    break;
}

又如

var num = 5;
switch(num){
  case true:
    console.log(num);
    break;
}

这里所说的一模一样就是说的，num这个值和case上的值要一样，不是单方面的case为true就为true。

而我们上面给switch传true就是因为这个原因，因为true是个布尔值，所以我们才可以用判断。

其实switch并没有限制你要传什么，它才不管你传的是false还是数组，你case上的值只要和它相对应就ok，最后举个例子

switch(undefined){
  case [][0]:
    console.log(undefined);
    break;
}

输出undefined。

虽然这篇文章是在讲switch，但我觉得它同时也说明了一个道理.........自己去悟。