为什么Javascript的OR返回的值不是true/false？

Question

为了获得浏览器视口宽度,我看到了这种结构:

function () { return window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth; }

我理解涉及的浏览器怪癖.我不明白的是为什么要||返回价值.所以我试过这个alert(undefined || 0 || 3);,果然,它发出警报3.我觉得这很离奇,因为我期待true或者false.谁能解释一下发生了什么？

Answer 1

如果JavaScript运算符的计算结果为truthy值,则将其||定义为返回左值,否则返回正确的值而不是返回true自身值.这就是它在规范中定义的方式.

我知道它有时会很烦人,你可能会不小心拿到一些你不想坚持的东西的引用,但它也允许你的例子有方便的技巧.一切都有其优点和缺点.

Answer 2

查看ECMAScript标准部分11.11二进制逻辑运算符

生产LogicalORExpression:LogicalORExpression || LogicalANDExpression的评估如下:

1.评估LogicalORExpression.

2.Call GetValue(结果(1)).

3.Call ToBoolean(Result(2)).

4.如果结果(3)为真,则返回结果(2).

5.评估LogicalANDExpression.

6.Call GetValue(结果(5)).

7.返回结果(6).

因此它评估每个操作数的布尔转换,但返回操作数的实际值.

如果您想知道Javascript如何将值转换为布尔值,请参见9.2 ToBoolean

Answer 3

不要把它想象成"或".它更像是表达式中的流量控制设备.||的值 表达式是第一个"truthy"子表达式的值.因此,对一系列子表达式的评估在某个时刻停止,好像

 expr1 || expr2 || expr3

是

 (function() {
   var rv = expr1;
   if (rv) return rv;
   rv = expr2;
   if (rv) return rv;
   return expr3;
 })()

Answer 4

OR函数是一个短路OR评估 - 它返回第一个非false的元素,否则返回最后一个false元素.

这实际上非常有用,所以你可以编写像这样的表达式

a = a || someValue;

哪个是一样的

if (a==null)
  a = someValue;