[英]Fallowing ESLint rules with else if
我有这个代码 else/if 代码
if (_.has($scope.item, 'comment_id')) {
track(one);
} else if (_.has($scope.item, 'post_id')) {
track(two);
} else {
if ($scope.followers) {
track(three);
} else {
track(four);
}
}
但 ESlint 想让我把它变成这个
if (_.has($scope.item, 'comment_id')) {
track(one);
} else if (_.has($scope.item, 'post_id')) {
track(two);
} else if ($scope.followers) {
track(three);
} else {
track(four);
}
它们是一样的吗?
是的,它们是等价的。 ESLint 足够聪明,可以检测到这一点,因此提出建议。 原因是在if/else
结构中你只有四个选项——当代码不匹配前两个条件中的任何一个时,它将始终执行外部
else {
if ($scope.followers) {
track(three);
} else {
track(four);
}
}
这只会导致发生两件事之一。 提取if ($scope.followers)
作为else if
遵循完全相同的逻辑路径。
通过抽象条件并生成真值表,然后检查结果,可以很容易地证明这一点。 它可以在纸上完成,但由于您已经拥有代码,因此将其制作为代码也很容易:
function nested(a, b, c) { if (a) { return "track(one)"; } else if (b) { return "track(two)"; } else { if (c) { return "track(three)"; } else { return "track(four)"; } } } function chained(a, b, c) { if (a) { return "track(one)"; } else if (b) { return "track(two)"; } else if (c) { return "track(three)"; } else { return "track(four)"; } } const truthTable = [ [false, false, false], [false, false, true ], [false, true , false], [false, true , true ], [true , false, false], [true , false, true ], [true , true , false], [true , true , true ], ]; for(const [a, b, c] of truthTable) { const nestedResult = nested(a, b, c); console.log(`called nested() with a=${a} b=${b} c=${c} result: ${nestedResult}`); const chainedResult = chained(a, b, c); console.log(`called nested() with a=${a} b=${b} c=${c} result: ${chainedResult}`); console.log(`matching results?: ${nestedResult === chainedResult}`); console.log(`------------------------`); }
或者,您可以生成一个实际的真值表来可视化结果:
function nested(a, b, c) { if (a) { return "track(one)"; } else if (b) { return "track(two)"; } else { if (c) { return "track(three)"; } else { return "track(four)"; } } } function chained(a, b, c) { if (a) { return "track(one)"; } else if (b) { return "track(two)"; } else if (c) { return "track(three)"; } else { return "track(four)"; } } const truthTable = [ [false, false, false], [false, false, true ], [false, true , false], [false, true , true ], [true , false, false], [true , false, true ], [true , true , false], [true , true , true ], ]; const enrich = truthTable .map(row => row.concat(nested(...row), chained(...row))) //add the results of the two calls .map(row => row.concat(row[row.length-1] === row[row.length-2])) //compare the last two const table = document.querySelector("table"); for (const rowData of enrich) { const newRow = table.insertRow(-1); for (const rowValue of rowData) { const cell = newRow.insertCell(-1); cell.textContent = rowValue; } }
table { border-collapse: collapse; } table, th, td { border: 1px solid black; }
<table> <tr> <th>a</th> <th>b</th> <th>c</th> <th>nested result</th> <th>chained result</th> <th>results equal</th> </tr> </table>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.