验证语句难以阅读

Question

我需要根据 sintaxis/structure 理解此语句的含义：

defaultValue: (closureData != undefined) ? (closureColl[i]) ? [closureColl[i].collaboratorGroup + "--" + closureColl[i].collaboratorArea] : (areaFixedValue) ? [areaFixedValue] : (areaDefaultValue) ? [areaDefaultValue] : [] : []

我习惯了遵循语法 (condition) ? 'if true' : 'if false'

两个“？”是什么意思？连续是什么意思？

Answer 1

它们是嵌套的 ternary conditional operators。以这种方式嵌套三元组通常被认为是非常糟糕的做法，因为你运行进入其中的原因是它们变得非常难以理解。您可以通过适当的缩进和括号使用来提高可读性，但该行甚至没有。

考虑一下如果你只有一个三元：

const foo = isBarTrue ? trueValue : falseValue;

但是考虑一下 trueValue 本身是否是一个三元表达式，因为您几乎可以任意嵌套表达式：

const foo = isBarTrue ? (isBazTrue ? truestValue : trueValue) : falseValue;

如果去掉括号，会更加混乱到不可读的地步：

const foo = isBarTrue ? isBazTrue ? truestValue : trueValue : falseValue;

一个有助于提高可读性的惯例是像这样缩进三元组（有一些方便的 eslint 和 prettier 插件会自动为您执行此操作，这很好）。基本上每个 ? 都会形成一个新的嵌套级别，由缩进线表示，而 : 符号“关闭”该嵌套级别并将下一行移出到最后一行的缩进级别无与伦比 ?。起初有点令人困惑，但这里是实际操作：

const foo = isBarTrue
  ? isBazTrue
    ? truestValue
    : trueValue
  : falseValue;

你给出的表达式比我的例子更糟糕，看起来像四个嵌套的三元条件运算符（你可以数出?的个数）这太糟糕了。我很快会回来编辑这个 post 看看我是否可以帮助你理清它。

编辑：要解决这个问题，一种方法是重构并提取具有“a ? b : c”形式的每个单独的三元组，而没有任何奇怪的双数，如“x : y : z”。尝试拉出一旦拉出就似乎有意义的三元组 - 有时从表达式的每个“末端”开始并交替拉出单个表达式会很有帮助。此外，re-writing 它与上面的缩进样式非常有帮助。

如果我们从这里开始：

const defaultValue = (closureData != undefined) ? (closureColl[i]) ? [closureColl[i].collaboratorGroup + "--" + closureColl[i].collaboratorArea] : (areaFixedValue) ? [areaFixedValue] : (areaDefaultValue) ? [areaDefaultValue] : [] : [];

尝试用缩进样式重写它：

const defaultValue = (closureData != undefined)
  ? (closureColl[i])
    ? [closureColl[i].collaboratorGroup + "--" + closureColl[i].collaboratorArea]
    : (areaFixedValue)
      ? [areaFixedValue]
      : (areaDefaultValue)
        ? [areaDefaultValue]
        : []
  : [];

现在我们可以这样重写它，取出最后一个“完整”的三元组，它本身就有意义，(areaDefaultValue) ? [areaDefaultValue] : []。记得用新的等价值替换原来三元组中的表达式：

const conditionalAreaDefaultValue = (areaDefaultValue)
 ? [areaDefaultValue]
 : [];

const defaultValue = (closureData != undefined)
  ? (closureColl[i])
    ? [closureColl[i].collaboratorGroup + "--" + closureColl[i].collaboratorArea]
    : (areaFixedValue)
      ? [areaFixedValue]
      : conditionalAreaDefaultValue
  : [];

然后，取出第一个“完整”三元组，它本身也有点意义，(closureColl[i]) ? [closureColl[i].collaboratorGroup + "--" + closureColl[i].collaboratorArea] : (areaFixedValue):

const conditionalAreaDefaultValue = (areaDefaultValue)
  ? [areaDefaultValue]
  : [];

const conditionalCollValue = (closureColl[i])
  ? [closureColl[i].collaboratorGroup + "--" + closureColl[i].collaboratorArea]
  : (areaFixedValue);

const defaultValue = (closureData != undefined)
  ? conditionalCollValue
    ? [areaFixedValue]
    : conditionalAreaDefaultValue
  : [];

从这里开始，其余的嵌套三元组更容易理解，看起来中间部分正在做很多工作来确定该表达式的“最终”值。让我们把那部分拉出来，conditionalCollValue ? [areaFixedValue] : conditionalAreaDefaultValue:

const conditionalAreaDefaultValue = (areaDefaultValue)
  ? [areaDefaultValue]
  : [];

const conditionalCollValue = (closureColl[i])
  ? [closureColl[i].collaboratorGroup + "--" + closureColl[i].collaboratorArea]
  : (areaFixedValue);

const conditionalFinalValue = conditionalCollValue
  ? [areaFixedValue]
  : conditionalAreaDefaultValue;

const defaultValue = (closureData != undefined)
  ? conditionalFinalValue
  : [];

您可以在此处进行更多重构，尤其是命名或将内容转换为 if 语句，但我会把它留给您。希望这个练习首先能阐明该表达式到底是怎么回事。

验证语句难以阅读

Validating statement hard to read

validation

typescript