JavaScript OR (||) 变量赋值说明

Question

鉴于这段 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 本身的值。

Answer 1

返回输出第一个真实值。

如果全部为 false，则返回最后一个 false 值。

例子：-

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

Answer 2

其称为短路运算符。

短路求值表示，仅当第一个参数不足以确定表达式的值时才执行或求值第二个参数。当 OR (||) 函数的第一个参数计算结果为 true 时，整体值必须为 true。

它还可以用于设置函数参数的默认值。

function theSameOldFoo(name){ 
  name = name || 'Bar' ;
  console.log("My best friend's name is " + name);
}
theSameOldFoo();  // My best friend's name is Bar
theSameOldFoo('Bhaskar');  // My best friend's name is Bhaskar`

Answer 3

它将新变量 (z) 设置为 x 的值（如果它是“true”）（非零，有效的对象/数组/函数/无论它是什么）或 y 否则。这是在 x 不存在的情况下提供默认值的一种相对常见的方法。

例如，如果您有一个带有可选回调参数的函数，您可以提供一个不执行任何操作的默认回调：

function doSomething(data, callback) {
    callback = callback || function() {};
    // do stuff with data
    callback(); // callback will always exist
}

Answer 4

这意味着如果设置了x，则z的值将为x，否则如果设置了y则它的值将被设置为 z 的值。

它与

if(x)
  z = x;
else
  z = y;

It's possiblebecause JavaScript 中的逻辑运算符不返回布尔值，而是返回完成操作所需的最后一个元素的值（在 OR 语句中，它将是第一个非 false 值，在 AND 语句中，它会成为最后一个）。如果操作失败，则返回 false。

Answer 5

它将计算 X，如果 X 不为 null、空字符串或 0（逻辑假），则将其分配给 z。如果 X 为 null、空字符串或 0（逻辑假），则它将把 y 分配给 z。

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

将输出'bob'；

Answer 6

根据比尔·希金斯的博客帖子； Javascript 逻辑或赋值惯用法 （2007 年 2 月），这种行为从 v1.2 开始是正确的（至少）

他还建议了它的另一种用途（引用）：
“跨浏览器差异的轻量级标准化”

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

Answer 7

有关说明，请参阅短路评估。这是实现这些运算符的常见方法；它并不是 JavaScript 所独有的。

Answer 8

这是为了分配一个默认值，在本例中是y的值，如果x变量是falsy >。

JavaScript 中的布尔运算符可以返回操作数，但并不总是像其他语言中那样返回布尔结果。

如果第一个操作数为假，则逻辑 OR 运算符 (||) 返回第二个操作数的值，否则返回第一个操作数的值。

例如：

"foo" || "bar"; // returns "foo"
false || "bar"; // returns "bar"

Falsy 值是指在布尔上下文中使用时强制为 false 的值，它们是 0、null >、未定义、空字符串、NaN，当然还有false。

Answer 9

Javacript 对逻辑运算符 || 使用 短路求值 和<代码>&&。 但是，它与其他语言的不同之处在于，它返回停止执行的最后一个值的结果，而不是 true 或 false 值。

以下值在 JavaScript 中被视为 false。

• false
• null
• "" （空字符串）
• 0
• Nan
• undefined

忽略 运算符优先级规则，为了简单起见，以下示例显示了哪个值停止了计算，并作为结果返回。

false || null || "" || 0 || NaN || "Hello" || undefined // "Hello"

NaN 之前的前 5 个值都是假值，因此它们都是从左到右计算的，直到满足第一个真值 - "Hello"，这使得整个表达式为 true，因此，任何进一步的内容都不会被计算，并且 "Hello" 作为表达式的结果返回。同样，在这种情况下：

1 && [] && {} && true && "World" && null && 2010 // null

前 5 个值都是真值，并进行求值，直到满足第一个假值 (null)，这使得表达式为假，因此 2010 是' t 不再计算，并且 null 作为表达式的结果返回。

您给出的示例是利用 JavaScript 的此属性来执行分配。它可以用在任何需要获取一组值中第一个真值或假值的地方。下面的代码会将值 "Hello" 分配给 b，因为这样可以更轻松地分配默认值，而不是进行 if-else 检查。

var a = false;
var b = a || "Hello";

您可以将下面的示例称为对此功能的利用，我相信它使代码更难以阅读。

var messages = 0;
var newMessagesText = "You have " + messages + " messages.";
var noNewMessagesText = "Sorry, you have no new messages.";
alert((messages && newMessagesText) || noNewMessagesText);

在警报中，我们检查 messages 是否为假，如果是，则评估并返回 noNewMessagesText，否则评估并返回 newMessagesText。由于此示例中的内容为假，因此我们在 noNewMessagesText 处停止并警告“抱歉，您没有新消息。”。

Answer 10

Javascript 变量没有类型，因此可以为 f 分配一个整数值，即使它是通过布尔运算符分配的。

f 被分配为不等于 false 的最接近值。所以0、false、null、undefined都被忽略了：

alert(null || undefined || false || '' || 0 || 4 || 'bar'); // alerts '4'

Answer 11

它没有任何魔力。布尔表达式，例如 a ||乙|| c || d 被延迟评估。 Interpeter 查找 a 的值，它是未定义的，所以它是 false，所以它继续前进，然后它看到 b 是 null，它仍然给出错误的结果，所以它继续前进，然后它看到 c - 同样的故事。最后它看到 d 并说“嗯，它不为空，所以我得到了结果”，并将其分配给最终变量。

这个技巧适用于所有对布尔表达式进行惰性短路求值的动态语言。在静态语言中，它不会编译（类型错误）。在急于评估布尔表达式的语言中，它将返回逻辑值（即本例中为 true）。

Answer 12

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

总之，该技术利用了语言编译方式的一个特性。也就是说，JavaScript“短路”了布尔运算符的计算，并将返回与第一个非 false 变量值或最后一个变量包含的任何内容关联的值。请参阅 Anurag 对那些计算结果为 false 的值的解释。

由于多种原因，使用这种技术并不是一个好的做法；然而。

1. 代码可读性：这是使用布尔运算符，如果不理解其编译行为，则预期结果将是布尔值。

2. 稳定性：这是使用语言编译方式的一个功能，该功能在多种语言之间是不一致的，因此它可能是未来更改的目标。

3. 记录的功能：有一个现有的替代方案可以满足此需求并且在更多语言中保持一致。这将是三元运算符：

   () ?值 1：值 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