javascript - 在多行 if 语句中使用前导或尾随 bool 运算符的原因

Question

对于具有多个 bool 运算符的 if 条件，我看到使用换行符来提高可读性。我记得看到有人关于加入条件部分的 bool 运算符是前导还是尾随的 eslint 规则。我不记得我在哪里看到的，他们使用的规则是什么，或者他们的推理是什么。

尾随:

if (
  someVariable &&
  otherThing
) {
  // code
}

领导:

if (
  someVariable
  && otherThing
) {
  // code
}

偏爱一种口味的原因是什么？哪个适合更清洁的 git 差异？

Answer 1

diff 不如缩进重要。在更复杂的场景中，尾随保持缩进不变。这是一个例子。请注意，第一个示例中的缩进具有相同缩进级别的所有相关项目，而在第二个示例中，您的眼睛必须向右看，因为 && 位于该行的开头。如果您从下往上扫描，影响会更大。

if (
   someVariable &&
   isComplexButEvalsToTrueOrFalse({
     myProp: "myValue"
   }) &&
   isComplexButEvalsToTrueOrFalse({
     myProp: "myOtherValue"
   })
) {
  // code
}

对比

if (
   someVariable
   && isComplexButEvalsToTrueOrFalse({
     myProp: "myValue"
   })
   && isComplexButEvalsToTrueOrFalse({
     myProp: "myOtherValue"
   })
) {
  // code
}

归根结底，一切都是主观的。值得一提的是，Prettier 使用尾随方法，除非最后一项是空数组或对象，并且它可以将所有内容放在一行中。它仅在存在嵌套表达式时缩进，在这种情况下使用 parenthesis and indentation说清楚。一般来说，当进入另一个级别时你会缩进，虽然 &&s 本身没有嵌套，但眼睛肯定必须向内看才能阅读 var/fn/obj/arr 的名称，因此它具有类似的效果。