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,使用查找表代替

原文地址:https://www.cnblogs.com/ly0612/p/12426772.html