给出这段JavaScript代码…

var a;
var b = null;
var c = undefined;
var d = 4;
var e = 'five';

var f = a || b || c || d || e;

alert(f); // 4

有人能给我解释一下这个技巧叫什么吗(我最好的猜测是在这个问题的标题中!)?它究竟是如何/为什么工作的?

我的理解是,变量f将被赋给第一个具有非null或未定义值的变量的最近值(从左到右),但我没有设法找到关于这种技术的很多参考资料,并且已经看到它被大量使用。

另外,这种技术是JavaScript特有的吗?我知道在PHP中做类似的事情会导致f有一个真正的布尔值,而不是d本身的值。


当前回答

根据Bill Higgins的博客文章;Javascript逻辑或赋值习惯(2007年2月),这个行为在v1.2(至少)是正确的。

他还提出了另一种用法(引用): “跨浏览器差异的轻量级规范化”

// determine upon which element a Javascript event (e) occurred
var target = /*w3c*/ e.target || /*IE*/ e.srcElement;

其他回答

它将计算X,如果X不为空字符串或0(逻辑错误),那么它将把它赋值给z。如果X为空字符串或0(逻辑错误),那么它将把y赋值给z。

var x = '';
var y = 'bob';
var z = x || y;
alert(z);

将输出'bob';

说明请参见短路评估。这是实现这些运算符的常用方式;它并不是JavaScript独有的。

这个问题已经得到了几个很好的答案。

总之,这种技术利用了语言编译方式的一个特性。也就是说,JavaScript“短路”了布尔运算符的求值,并将返回与第一个非假变量值或最后一个变量包含的任何值相关联的值。参见Anurag对这些值的解释,这些值将被计算为假。

出于几个原因,使用这种技术并不是一种好的实践;然而。

Code Readability: This is using Boolean operators, and if the behavior of how this compiles is not understood, then the expected result would be a Boolean value. Stability: This is using a feature of how the language is compiled that is inconsistent across multiple languages, and due to this it is something that could potentially be targeted for change in the future. Documented Features: There is an existing alternative that meets this need and is consistent across more languages. This would be the ternary operator: () ? value 1: Value 2.

使用三元操作符确实需要更多的输入,但它可以清楚地区分要计算的布尔表达式和要赋值的值。此外,它还可以被链接,因此可以重新创建上面执行的默认赋值类型。

var a;
var b = null;
var c = undefined;
var d = 4;
var e = 'five';

var f =  ( a ) ? a : 
                ( b ) ? b :
                       ( c ) ? c :
                              ( d ) ? d :
                                      e;

alert(f); // 4

返回输出的第一个真值。

如果全部为假,则返回最后一个假值。

例子:-

  null || undefined || false || 0 || 'apple'  // Return apple

根据Bill Higgins的博客文章;Javascript逻辑或赋值习惯(2007年2月),这个行为在v1.2(至少)是正确的。

他还提出了另一种用法(引用): “跨浏览器差异的轻量级规范化”

// determine upon which element a Javascript event (e) occurred
var target = /*w3c*/ e.target || /*IE*/ e.srcElement;