javascript - 三元运算符多个语句

Question

这个问题已经有答案了:

Javascript - Ternary Operator with Multiple Statements (5 个回答)

已关闭 3 年前。

如果条件为真或为假，我想做多件事。我试图将这些语句包装在 { } 中但它不起作用。所以我的代码:

theId == this.state.correctId ? 
          console.log("Correct Id!") :
          console.log("TRY AGAIN")

我尝试过:

theId == this.state.correctId ? 
          {console.log("Correct Id!"); //semicolon does not make any difference 
          this.setState({counter: this.state.counter+1})
          } :
          console.log("TRY AGAIN")

这行不通。如果条件为 true 或 false，如何添加多个语句？

谢谢。

Answer 1

只有当您需要提出一个(有条件地)是这样或那样的表达式时，才应使用条件运算符，例如

const something = cond ? expr1 : expr2;

因为这里的情况并非如此(并且您想要记录或调用 setState)，所以条件运算符不合适；使用 if/else 代替:

if (theId == this.state.correctId) {
  console.log("Correct Id!")
  this.setState({counter: this.state.counter+1});
} else {
  console.log("TRY AGAIN");
}

您可以通过使用逗号运算符组合表达式来从技术上稍微调整您的原始代码:

theId == this.state.correctId
? (
  console.log("Correct Id!"),
  this.setState({counter: this.state.counter+1})
)
: console.log("TRY AGAIN");

但这非常难以阅读，并且不是代码读者期望从条件运算符中看到的内容，因此应该避免。

当不使用结果表达式时使用条件运算符可能只应保留用于代码高尔夫和缩小，而不是在专业源代码中，其中可读性极其重要。