什么是双管运算符(||)?

双管道操作符(||)是逻辑或操作符。在大多数语言中，它是这样工作的:

如果第一个值为false，则检查第二个值。如果这个值为真，它就返回真，如果第二个值为假，它就返回假。 如果第一个值为真，它总是返回真，不管第二个值是什么。

它的工作原理是这样的:

function or(x, y) {
  if (x) {
    return true;
  } else if (y) {
    return true;
  } else {
    return false;
  }
}

如果你还是不明白，看看这张表:

      | true   false  
------+---------------
true  | true   true   
false | true   false  

换句话说，只有当两个值都为假时，它才为假。

在JavaScript中有什么不同?

JavaScript有点不同，因为它是一种松散类型的语言。在这种情况下，这意味着您可以使用||操作符，其值不是布尔值。虽然它没有任何意义，但你可以将这个操作符用于例如一个函数和一个对象:

(function(){}) || {}

那里发生了什么?

如果值不是布尔值，JavaScript将隐式转换为布尔值。这意味着如果值是假的(例如0，""，null, undefined(参见JavaScript中的所有假值))，它将被视为假的;否则它就被当作真的。

所以上面的例子应该给出true，因为空函数是true。其实并不是这样。它返回空函数。这是因为JavaScript的||操作符不能像我开头写的那样工作。它的工作原理如下:

如果第一个值为假值，则返回第二个值。 如果第一个值为真值，则返回第一个值。

惊讶吗?实际上，它与传统的||操作符“兼容”。它可以写成如下函数:

function or(x, y) {
  if (x) {
    return x;
  } else {
    return y;
  }
}

如果你传递一个真值作为x，它返回x，也就是说，一个真值。所以如果你在if从句中使用它:

(function(x, y) {
  var eitherXorY = x || y;
  if (eitherXorY) {
    console.log("Either x or y is truthy.");
  } else {
    console.log("Neither x nor y is truthy");
  }
}(true/*, undefined*/));

你会得到" x或y是对的"

如果x是假的，要么xory是y，在这种情况下，你会得到"要么x要么y是真的"如果y是真的;否则你就会得到" x和y都不是真理"

真正的问题

现在，当你知道||算子是如何工作的，你可能自己就能知道x = x || y是什么意思。如果x为真，x被赋值给x，所以实际上什么都不会发生;否则y赋值给x。通常用于定义函数中的默认形参。然而，它通常被认为是一种糟糕的编程实践，因为它阻止您将错误的值(不一定是未定义或null)作为参数传递。考虑下面的例子:

function badFunction(/* boolean */flagA) {
  flagA = flagA || true;
  console.log("flagA is set to " + (flagA ? "true" : "false"));
}

乍一看，它是有效的。然而，如果你传递false作为flagA参数会发生什么(因为它是布尔值，即可以为真或假)?这将成为现实。在这个例子中，没有办法将flagA设置为false。

更好的方法是显式检查flagA是否未定义，如下所示:

function goodFunction(/* boolean */flagA) {
  flagA = typeof flagA !== "undefined" ? flagA : true;
  console.log("flagA is set to " + (flagA ? "true" : "false"));
}

虽然它更长，但它总是有效的，而且更容易理解。

---

您还可以使用ES6语法作为默认函数参数，但请注意，它不适用于老式浏览器(如IE)。如果您希望支持这些浏览器，您应该使用Babel编译您的代码。

请参见MDN上的逻辑运算符。

什么是双管运算符(||)?

双管道操作符(||)是逻辑或操作符。在大多数语言中，它是这样工作的:

如果第一个值为false，则检查第二个值。如果这个值为真，它就返回真，如果第二个值为假，它就返回假。 如果第一个值为真，它总是返回真，不管第二个值是什么。

它的工作原理是这样的:

function or(x, y) {
  if (x) {
    return true;
  } else if (y) {
    return true;
  } else {
    return false;
  }
}

如果你还是不明白，看看这张表:

      | true   false  
------+---------------
true  | true   true   
false | true   false  

换句话说，只有当两个值都为假时，它才为假。

在JavaScript中有什么不同?

JavaScript有点不同，因为它是一种松散类型的语言。在这种情况下，这意味着您可以使用||操作符，其值不是布尔值。虽然它没有任何意义，但你可以将这个操作符用于例如一个函数和一个对象:

(function(){}) || {}

那里发生了什么?

如果值不是布尔值，JavaScript将隐式转换为布尔值。这意味着如果值是假的(例如0，""，null, undefined(参见JavaScript中的所有假值))，它将被视为假的;否则它就被当作真的。

所以上面的例子应该给出true，因为空函数是true。其实并不是这样。它返回空函数。这是因为JavaScript的||操作符不能像我开头写的那样工作。它的工作原理如下:

如果第一个值为假值，则返回第二个值。 如果第一个值为真值，则返回第一个值。

惊讶吗?实际上，它与传统的||操作符“兼容”。它可以写成如下函数:

function or(x, y) {
  if (x) {
    return x;
  } else {
    return y;
  }
}

如果你传递一个真值作为x，它返回x，也就是说，一个真值。所以如果你在if从句中使用它:

(function(x, y) {
  var eitherXorY = x || y;
  if (eitherXorY) {
    console.log("Either x or y is truthy.");
  } else {
    console.log("Neither x nor y is truthy");
  }
}(true/*, undefined*/));

你会得到" x或y是对的"

如果x是假的，要么xory是y，在这种情况下，你会得到"要么x要么y是真的"如果y是真的;否则你就会得到" x和y都不是真理"

真正的问题

现在，当你知道||算子是如何工作的，你可能自己就能知道x = x || y是什么意思。如果x为真，x被赋值给x，所以实际上什么都不会发生;否则y赋值给x。通常用于定义函数中的默认形参。然而，它通常被认为是一种糟糕的编程实践，因为它阻止您将错误的值(不一定是未定义或null)作为参数传递。考虑下面的例子:

function badFunction(/* boolean */flagA) {
  flagA = flagA || true;
  console.log("flagA is set to " + (flagA ? "true" : "false"));
}

乍一看，它是有效的。然而，如果你传递false作为flagA参数会发生什么(因为它是布尔值，即可以为真或假)?这将成为现实。在这个例子中，没有办法将flagA设置为false。

更好的方法是显式检查flagA是否未定义，如下所示:

function goodFunction(/* boolean */flagA) {
  flagA = typeof flagA !== "undefined" ? flagA : true;
  console.log("flagA is set to " + (flagA ? "true" : "false"));
}

虽然它更长，但它总是有效的，而且更容易理解。

---

您还可以使用ES6语法作为默认函数参数，但请注意，它不适用于老式浏览器(如IE)。如果您希望支持这些浏览器，您应该使用Babel编译您的代码。

请参见MDN上的逻辑运算符。

基本上，它检查||之前的值是否为true。如果是，则取该值，如果不是，则取||之后的值。

它将取||之后的值(据我所知):

未定义的 假 0 (Null或空字符串)

虽然Cletus的回答是正确的，但我觉得应该在JavaScript中添加更多关于“评估为假”的细节。

var title = title || 'Error';
var msg   = msg || 'Error on Request';

不仅仅是检查是否提供了title/msg，而且还检查它们中的任何一个是假的。即下列其中一项:

假的。 0(零) ""(空字符串) null。 未定义的。 NaN(一个特殊的数字值，意思不是一个数字!)

在这一行中

var title = title || 'Error';

如果title为真(即，不是假的，所以title = "titleMessage"等)，那么布尔OR(||)运算符已经找到了一个“真”值，这意味着它的计算结果为真，因此它短路并返回真值(title)。

如果title是假的(即上面的列表之一)，那么布尔OR(||)运算符已经找到了一个“假”值，现在需要计算运算符的另一部分“Error”，该运算符的计算结果为真，因此返回。

如果运算符两边的值都为false，它也会返回第二个“falsy”运算符(经过一些快速的firebug控制台实验)。

i.e.

return ("" || undefined)

返回undefined，这可能是为了允许您在尝试将title/message默认为""时使用此问题中询问的行为。也就是跑步之后

var foo = undefined
foo = foo || ""

Foo将被设置为""

双管操作员

这个例子可能有用:

var section = document.getElementById('special');
if(!section){
     section = document.getElementById('main');
}

它也可以是:

var section = document.getElementById('special') || document.getElementById('main');

再解释一下……

||操作符是逻辑或操作符。如果第一部分为真，则结果为真;如果第二部分为真，则结果为真;如果两部分都为真，则结果为真。为了清晰起见，这里是一个表格:

 X | Y | X || Y 
---+---+--------
 F | F |   F    
---+---+--------
 F | T |   T    
---+---+--------
 T | F |   T    
---+---+--------
 T | T |   T    
---+---+--------

Now notice something here? If X is true, the result is always true. So if we know that X is true we don't have to check Y at all. Many languages thus implement "short circuit" evaluators for logical-or (and logical-and coming from the other direction). They check the first element and if that's true they don't bother checking the second at all. The result (in logical terms) is the same, but in terms of execution there's potentially a huge difference if the second element is expensive to calculate.

那么这和你的例子有什么关系呢?

var title   = title || 'Error';

Let's look at that. The title element is passed in to your function. In JavaScript if you don't pass in a parameter, it defaults to a null value. Also in JavaScript if your variable is a null value it is considered to be false by the logical operators. So if this function is called with a title given, it is a non-false value and thus assigned to the local variable. If, however, it is not given a value, it is a null value and thus false. The logical-or operator then evaluates the second expression and returns 'Error' instead. So now the local variable is given the value 'Error'.

这是因为在JavaScript中实现了逻辑表达式。它不会返回一个合适的布尔值(真或假)，而是返回它在一些规则下给出的值，这些规则被认为是等价于真，什么被认为是等价于假。查看JavaScript参考，了解JavaScript在布尔上下文中认为什么是真或假。