js if/else 语句优化策略
前言
在项目当中，都会遇到需要做大量分支判断的情况，最常用到的就是用 if/else；但是用起来并不是很美观；所以当遇到大量分支判断嵌套在一起时，就会显得很难阅读。就要对应地做出一些优化。
简单逻辑判断
提前 return
javascript
let a = 1;
if (a) {
a = 2;
} else {
return;
}
// 写成
if (!a) {
return;
}
a = 2;||
javascript
let a = 1;
if (a) {
a = 1;
} else {
a = 2;
}
// 修改为
a = a || 0;三元表达式
javascript
let a = 1,
b = 2,
c = 3,
d = 4;
if (a === b) {
a = d;
} else {
a = c;
}
// 修改为
a = a === b ? d : c;按位异或运算符^
javascript
let a =1,b=2,c=1,
if(a === c){
c = b
}else if(b === c){
c = a
}
//写成
a = a^b^c复杂逻辑判断
if 逻辑优化
人们考虑的东西到时候，都会把最可能发生的情况先做好准备。优化 if 逻辑的时候也可以这样想：把最可能出现的条件放在前面，把最不可能出现的条件放在后面，这样程序执行时总会按照写的逻辑的先后顺序逐一检测所有的条件，知道发现匹配的条件才会停止继续检测。
- if 的优化目标：最小化找到分支之前所判断条件体的数量。
- if 优化的方法：将最常见的条件放在首位。
javascript
var a = 1;
if(a < 10){
...
}else if(a > 10 && a < 100){
...
}else{
...
}switch/case
switch 在性能上和 if/else 区别不是很大，在大量分支判断时会比 if/else 看上去整洁。
javascript
function formatData(time, format) {
var t = new Date(time);
var tf = function (i) {
return (i < 10 ? "0" : "") + i;
};
return format.replace(/yyyy|MM|dd|HH|mm|ss/g, function (a) {
switch (a) {
case "yyyy":
return tf(t.getFullYear());
break;
case "MM":
return tf(t.getMonth() + 1);
break;
case "mm":
return tf(t.getMinutes());
break;
case "dd":
return tf(t.getDate());
break;
case "HH":
return tf(t.getHours());
break;
case "ss":
return tf(t.getSeconds());
break;
}
});
}利用 Object 重构
javascript
let a = 0;
if (type === "type_1") {
a = 10;
} else if (type === "type_2") {
a = 20;
} else if (type === "type_3") {
a = 30;
}
// 改成
const obj = {
type_1: 10,
type_2: 20,
type_3: 30,
};
console.log(obj[type]);利用 Map
javascript
let a = 0;
if (type === "type_1") {
function type1() {
a = 10;
}
} else if (type === "type_2") {
function type2() {
a = 20;
}
} else if (type === "type_3") {
function type3() {
a = 30;
}
}
const action = new Map([
[
"type_1",
() => {
a = 10;
},
],
[
"type_2",
() => {
a = 20;
},
],
[
"type_3",
() => {
a = 30;
},
],
]);
let data = action.get(type);
console.log(data());