# 如何优化if多层判断

• 3
``````aa(item) {
let color;
let eq1 = "";
let eq2 = "";

for (let i = 0; i < this.option.columnTow.length; i++) {
let element = this.option.columnTow[i];
console.log(parseInt(eq1) < parseInt(item.value))
if (eq1 != "" && eq2 != "" && parseFloat(eq1) < parseFloat(item.value) && parseFloat(item.value) < parseFloat(eq2)) {
color = element.prop;
break;
}
else if (eq1 != "" && eq2 != "" && parseFloat(eq2) < parseFloat(eq1)) {
if (element.equation == "大于" && parseFloat(item.value) > parseFloat(element.value)) {
color = element.prop;
break;
}
else if (element.equation == "小于" && parseFloat(item.value) < parseFloat(element.value)) {
color = element.prop;
break;
}
}
if (element.equation == "大于" && eq2 == "" && parseFloat(item.value) > parseFloat(element.value)) {
color = element.prop;
break;
}
if (element.equation == "小于" && eq1 == "" && parseFloat(item.value) < parseFloat(element.value)) {
color = element.prop;
break;
}
if (element.equation == "等于" && parseFloat(item.value) == parseFloat(element.value)) {
color = element.prop;
break;
}
}
return color;
}``````

5 个回答
✓ 已被采纳
1. `function aa``function` 没写，我复制到IDE报错了。
2. 整体看下来逻辑不复杂，循环中判断条并修改color，打断循环，返回color

``````function aa(item) {
let color;
let eq1 = "";
let eq2 = "";

for (let i = 0; i < this.option.columnTow.length; i++) {
let element = this.option.columnTow[i];
console.log(parseInt(eq1) < parseInt(item.value))
if (条件1) { color = element.prop; break; }
else if (条件2) {
if (条件3) { color = element.prop;  break; }
else if (条件4) { color = element.prop; break; }
}
if (条件5) { color = element.prop; break; }
if (条件6) { color = element.prop; break; }
if (条件7) { color = element.prop; break; }
}
return color;
}``````

那实际上并不需要打断这个动作，直接返回值即可，也就是这段可以简化为

``````function aa(item) {
let eq1 = "";
let eq2 = "";

for (let i = 0; i < this.option.columnTow.length; i++) {
let element = this.option.columnTow[i];
console.log(parseInt(eq1) < parseInt(item.value))
if (条件1) return element.prop;
if (条件2 && 条件3) return element.prop;
if (条件2 && 条件4) return element.prop;
if (条件5) return element.prop;
if (条件6) return element.prop;
if (条件7) return element.prop;
}
}``````
3. 条件具备相似性,可以合并同类项。

`````` let 条件1 = eq1 != "" && eq2 != "" && parseFloat(eq1) < parseFloat(item.value) && parseFloat(item.value) < parseFloat(eq2)
let 条件2 = eq1 != "" && eq2 != "" && parseFloat(eq2) < parseFloat(eq1)
let 条件3 = element.equation == "大于" && parseFloat(item.value) > parseFloat(element.value)
let 条件4 = element.equation == "小于" && parseFloat(item.value) < parseFloat(element.value)
let 条件5 = element.equation == "大于" && eq2 == "" && parseFloat(item.value) > parseFloat(element.value)
let 条件6 = element.equation == "小于" && eq1 == "" && parseFloat(item.value) < parseFloat(element.value)
let 条件7 = element.equation == "等于" && parseFloat(item.value) == parseFloat(element.value)``````

一个是判断eq1和eq2，另一个是item.value 和 element.value，这部分简化下来就是

``````
let 条件10 = eq1 == ""
let 条件11 = eq2 == ""
let 条件12 = parseFloat(item.value) - parseFloat(element.value)
let 条件13 = parseFloat(eq2) < parseFloat(eq1)
let 条件14 = element.equation

let 条件1 = !条件10 && !条件11 && !条件13 && parseFloat(eq1) < parseFloat(item.value) && parseFloat(item.value) < parseFloat(eq2)
let 条件3 = !条件10 && !条件11 && 条件13 && 条件14 == "大于" && 条件12 >0
let 条件4 = !条件10 && !条件11 && 条件13 && 条件14 == "小于" && 条件12 <0
let 条件5 = 条件14 == "大于" && 条件11 && 条件12 > 0
let 条件6 = 条件14 == "小于" && 条件10 && 条件12 < 0
let 条件7 = 条件14 == "等于" && 条件12 == 0``````

并且可以看出条件1到条件7是互异的，也就是其中一个成立，其他的肯定都是不成立的。所以顺序并不影响判断，我们调整顺序并用或链接起来

``````function aa(item) {
let eq1 = "";
let eq2 = "";

for (let i = 0; i < this.option.columnTow.length; i++) {
let element = this.option.columnTow[i];
let 条件10 = eq1 == ""
let 条件11 = eq2 == ""
let 条件12 = parseFloat(item.value) - parseFloat(element.value)
let 条件13 = parseFloat(eq2) < parseFloat(eq1)
let 条件14 = element.equation
if (
条件14 == "等于" && 条件12 == 0 ||
条件10 ? (
条件14 == "小于" && 条件12 < 0
) : (
条件11 ? (
条件14 == "大于" && 条件12 > 0
) : (
条件13 ? (
条件14 == "大于" && 条件12 > 0
|| 条件14 == "小于" && 条件12 < 0
) : (
parseFloat(eq1) < parseFloat(item.value) && parseFloat(item.value) < parseFloat(eq2)
)
)
)
) return element.prop;
}
return null
}``````

如果能将`条件14 == "大于" && 条件12 > 0` 封装起来，会更加利于简化。