JavaScript中三元运算符的求值方式是怎样的？

Question

关于 JavaScript 中的三元(? :)运算符，我想知道它是如何被一个典型的浏览器的 JavaScript 解释器评估的:

备选方案 A:

1. 评估第一个操作数。
2. 如果第一个操作数的结果为 true，则评估并返回第二个操作数。
3. 否则，评估并返回第三个操作数。

备选方案 B:

1. 所有三个操作数都会被评估。
2. 如果第一个操作数的结果为 true，则返回第二个操作数的结果。
3. 否则，返回第三个操作数的结果。

备选方案 C:

当然，如果备选方案 A 和备选方案 B 都没有准确描述三元运算符的工作方式，请解释它的工作原理。

- pyon

---

"替代方案A": (1)? functionOne(): functionTwo(), 如果在两个函数中都加入简单的提示消息，只有 functionOne 会显示其消息。请注意，翻译保持原意，不包含解释或其他内容。 - JCOC611

哦，哇。谢谢。请将其发布为答案，以便我可以接受它。 - isekaijin

你可以测试得比别人回复快。 - spender

我无法在IE6、IE7和IE8上进行测试。 - isekaijin

Answer 1

根据规范，它的工作原理类似于备选方案A：

ConditionalExpression：LogicalORExpression？AssignmentExpression：AssignmentExpression的产生式按以下方式进行评估：

1. 让lref成为评估LogicalORExpression的结果。
2. 如果ToBoolean(GetValue(lref))为true，则
   • 让trueRef成为评估第一个AssignmentExpression的结果。
   • 返回GetValue(trueRef)。
3. 否则
   • 让falseRef成为评估第二个AssignmentExpression的结果。
   • 返回GetValue(falseRef)。

- Felix Kling

Answer 2

"替代方案A："

(1)? functionOne(): functionTwo()

如果您在这两个函数中都放置了简单的提示消息，只有functionOne会显示其消息。

function functionOne(){ 
   alert("one");
}
function functionTwo(){ 
   alert("two");
}

- JCOC611

Answer 3

三元运算符之所以采用惰性求值，有几个原因：

1. 当你只会返回if或else时，评估所有操作数是低效的。
2. 惰性求值允许您执行像x != 0 ? 10 / x : 10;这样的操作。如果同时评估所有内容，则如果x为零，您将得到除以零错误。

- Jesse Cohen

---

抱歉，随机更正：JS中没有除以零的错误。1/0 === Infinity - nrabinowitz

Answer 4

运行此命令并查看结果：

function bool() {
    alert('bool');
    return false;
}

function a() {
    alert('a');
    return 'A';
}

function b() {
    alert('b');
    return 'B';
}

alert(bool() ? a() : b())

- Kevin Dolan