Что такое оператор двойной трубы (||)?

Оператор двойной трубы (||) является логическим оператором OR. В большинство языков работает следующим образом:

• Если первое значение false, оно проверяет второе значение. Если это true, он возвращает true, и если он false, он возвращает false.
• Если первое значение true, оно всегда возвращает true, независимо от того, что второе значение.

Таким образом, в основном это работает как эта функция:

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

Если вы все еще не понимаете, посмотрите на эту таблицу:

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

Другими словами, это только false, когда оба значения являются ложными.

Как это отличается в JavaScript?

JavaScript немного отличается, потому что это свободно набранный язык. В этом случае это означает, что вы можете использовать оператор || со значениями, которые не являются логическими. Хотя это не имеет смысла, вы можете использовать этот оператор, например, с помощью функции и объекта:

(function(){}) || {}

Что там происходит?

Если значения не являются логическими, JavaScript делает неявным разговор до логического. Это означает, что если значение ложно (например, 0, "", null, undefined (см. Также Все значения false в JavaScript )), он будет рассматриваться как false; в противном случае это рассматривается как 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*/));

, вы получите "Either x or y is truthy.".

Если x был ложным, eitherXorY будет y , В этом случае вы получите "Either x or y is truthy.", если y правдиво; в противном случае вы получите "Neither x nor y is truthy".

Фактический вопрос

Теперь, когда вы знаете, как работает оператор ||, вы, вероятно, можете сами выяснить, что делает x = x || y имею в виду. Если x правдиво, x присваивается x, так что на самом деле ничего не происходит; в противном случае y присваивается x. Он обычно используется для определения параметров по умолчанию в функциях. Тем не менее, это часто считается плохой практикой программирования, поскольку она не позволяет вам передавать значение ложности (что необязательно undefined или null) в качестве параметра. Рассмотрим следующий пример:

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

Он выглядит действительным с первого взгляда. Однако что произойдет, если вы передадите false в качестве параметра flagA (поскольку он является логическим, то есть может быть true или false)? Это станет true. В этом примере нет способа установить flagA на false.

Было бы лучше прояснить, действительно ли flagA является undefined, например:

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

Хотя он длиннее, он всегда работает, и его легче понять.

Вы также можете использовать синтаксис ES6 для параметров функции по умолчанию , но обратите внимание что он не работает в старых браузерах (например, IE). Если вы хотите поддерживать эти браузеры, вы должны передать ваш код с помощью Babel .

См. Также Логические операторы на MDN .