JavaScript 的 if else 和 switch对比

两者的对比
　　使用if else 还是 switch 目前一般是从代码可读性的角度出发，基于判断条件的数量来决定：数量越多就越倾向于 switch 而不是 if else。

　　事实证明除了代码可读性，switch 的运行速度是比 if else 更快的。

　　相比较于 if else ，switch 的实现采取了branch table 索引来进行优化（深入了解可以看这里：https://en.wikipedia.org/wiki/Switch_statement） ，而且 switch 语句比较时使用是全等操作符，不会发生类型转换的损耗。

环境：Mac、火狐71
9999999次 chrome看不出明显变化

if-else 例子

var start = new Date().getTime();
var a = 6;
for(let i = 0; i < 9999999; i++) {
switch(a) {
case 1: ;break;
case 2: ;break;
case 3: ;break;
case 4: ;break;
case 5: ;break;
default : ;
}
}
var end = new Date().getTime()
console.log(end - start);

// 运行时间在 1100 毫秒左右波动

　　

switch 例子

var start = new Date().getTime();
var a = 6;
for(let i = 0; i < 9999999; i++) {
if (a == 1) {
} else if (a == 2) {
} else if (a == 3) {
} else if (a == 4) {
} else if (a == 5) {
} else {
} 
}
var end = new Date().getTime()
console.log(end - start)

// 运行时间在 5200 毫秒左右波动

　　

优化 if-else

1、确保最可能出现的条件放在首位

以上面为例，我的变量 a 最可能等于 1 那么，执行时间就会大大降低

var a = 1; // 把这个改为 1
for(let i = 0; i < 9999999; i++) {
if (a == 1) { // 走到这里就满足了条件
} else if (a == 2) {
} else if (a == 3) {
} else if (a == 4) {
} else if (a == 5) {
} else {
} 
}
// 现在它的执行时间和 switch 执行时间无限接近了，在1100左右

如果 a = 2 ，那么执行时间在2200毫秒左右波动

因此，在 if-else 语句中，它的条件语句应该以 **最大概率出现到最小概率出现依次排列。**

2、减少判断的次数，使用嵌套语句

假设 a 的值出现的概率都差不多，那么可以减少外层的 if-else，而是把它拆开，分成几块来判断。

把最开始那个if-else的例子稍微改一下

var start = new Date().getTime();
var a = 6;
for(let i = 0; i < 9999999; i++) {
if (a <= 3) {
if (a == 1) {
} else if (a == 2) {
} else {
}
} else {
if (a == 4) {
} else if (a == 5) {
} else {
} 
}
}
var end = new Date().getTime()
console.log(end - start)

// 现在它的执行时间在 3200 毫秒左右波动

　　

## 查找表

在项目中，有时候优化条件语句的最好办法还是避免使用 if-else 和 switch 语句，而是通过数组和对象来查询，也就是查找表（lookup Tables）。

直接看例子

// 通过条件判断
function getColor(c) {
if(c == 'blue'){
return 'blue的rgba值'
}else if(c === 'block'){
return 'block的rgba值'
}else if(c === 'yellow'){
return 'yellow的rgba值'
}else(c === 'green'){
return 'green的rgba值'
}
}

// 通过 map 映射
function getColor(c) {
return {
'blue': 'blue的rgba值',
'block': 'block的rgba值',
'yellow': 'yellow的rgba值',
'green': 'green的rgba值',
}[c]
}

　　

整个过程只是对象成员 或者 数组项的查询，没有条件语句，因此也不会有那些性能上的问题。

结论

一：switch 性能高于 if-else

二：项目中尽量避免使用 switch 和 if else，使用查找表代替