Логические операторы &&, || и ! в JavaScript

Логические операторы, как правило, используются с булевым типом данных и возвращают логическое значение (истина или ложь).

Как правило..., на самом деле эти операторы и называются «логическими», но в JavaScript могут оперировать значениями любого типа и возвращать также значения любого типа.

&& - логическое И

С логическим И на первый взгляд всё просто, если оба операнда истины, то выражение истинно:

if (true && true) document.write("Это работает!<br>");

Этот пример можно немного усложнить и записать операндами выражения сравнения.

if (5>1 && 2<9) document.write("Значение if: "+ (5>1 && 2<9) +"<br>");

Но на самом деле всё не так просто. В данном примере мы использовали операторы сравнения, они возвращают логические значения true / false. Но операндами логического И могут быть выражения с арифметическими операторами.

Давайте изменим пример:

if (5+1 && 2+9) document.write("Значение if: "+ (5+1 && 2+9) +"<br>");

В этом примере оператор && вернёт 11. Дело в том, что на самом деле оператор && возвращает последний операнд, если все операнды истинны.

Если хоть один из операндов равен лжи, то && возвратит первый операнд со значением ложь.

document.write("Оба операнда false: "+ (5-5 && 1>8) +"<br>");

В этом примере оператор && вернёт цифру 0. Можно, для более глубокого понимания, усложнить пример.

document.write("Три операнда false: "+ (5-5 && 1>8 && false) +"<br>");

Что есть ложь в JavaScript

Сейчас хороший повод повторить что есть ложь в JavaScript.

  • Число 0 (ноль).
  • Пустая строка "".
  • Логическое значение false :)
  • Значение null.
  • Значение undefined.
  • Значение NaN (Not a Number - не число).

Всё остальное в логическом контексте будет истиной.

|| - логическое ИЛИ

Оператор логического ИЛИ возвращает первое значение true (истина). А если истинных значений нет, то последнее ложное.

document.write("Три операнда false: "+ (5-5 || 1>8 || false) +"<br>");
document.write("Другой пример: "+ (5-5 || 9+8 || true) +"<br>");

Логические выражения вычисляются слево направо. Как только оператор ИЛИ обнаружит значение true - он вернёт его, далее вычеслений не будет. Если не встретит ни одно значение true, то вернёт последнее значение, а оно точно будет false. Мы видим, ИЛИ вычисляет ровно столько значений, сколько необходимо.

var myVar = 10;
true || ++myVar;	// Код ++myVar не будет выполнен.
document.write("Переменная myVar: "+ myVar +"<br>");
var myVar2 = 20;
false || ++myVar2;
document.write("Переменная myVar2: "+ myVar2 +"<br>");

! - логическое НЕ

Логическое НЕ - унарный оператор. Он принимает операнд и изменяет его значение истина/ложь на противоположное.

document.write("Пример 1: "+ !false +"<br>");
document.write("Пример 2: "+ !(5-5) +"<br>");
document.write("Пример 3: "+ !"строка" +"<br>");

Также становится очевидно, при помощи двойного логического НЕ мы можем преобразовать литерал в тип Boolean.

var str = "Строка."
// две эквивалентные записи
document.write("Boolean тип переменной str: "+ !!str +".<br>");
document.write("Boolean тип переменной str: "+ Boolean(str) +".<br>");

Короткий цикл вычислений

Оператор || (ИЛИ)

Итак, логические выражения вычисляются слево направо. Например, когда оператор ИЛИ обнаружит значение true - он вернёт его, далее вычеслений не будет. Эту особенность можно использовать для поиска первого истинного выражения в списке.

var myVar = 0;
var myBool = false;
var myStr = "";
var myMsg = "Привет!";
var result = (myVar || myVar++ || myBool || myStr || myMsg || ++myVar);
document.write("Переменная result: "+ result +"<br>");

Переменная result будет равна "Привет!". Постфиксный инкремент myVar++ сработает после вычисления выражения, а префиксный инкремент ++myVar не будет выполнен, так как ранее оператор || обнаружит истину.

Оператор && (И)

Вычисления слево направо, если аргумент — false, оператор && возвращает его и заканчивает вычисления. Иначе — вычисляет дальше, если false в списке нет, возвращает последний правый аргумент, а он будет true.

Вот пример:

var myVar = 10;
var myBool = true;
var myStr = "";	// тут false
var myMsg = "Привет!";
var result = (myVar && myVar++ && myBool && myStr && myMsg && ++myVar);
document.write("Переменная result: "+ result +"<br>");

Вычисления остановятся на переменной myStr, именно её значение "" и будет присвоено в переменную result.

&& вместо if

В простых случаях можно использовать оператор && вместо инструкции if:

var myVar = 10;
(myVar > 2) && document.write("Переменная myVar больше 2.");

В этом примере правый операнд выполнится только в том случае, если левый имеет логический тип истина.

Такая запись плохо читаема, рекомендуется использовать конструкцию JavaScript: if и else.