Логические операторы ИЛИ (||), И (&&), НЕ (!) в JavaScript

В этой статье мы рассмотрим логическое ИЛИ (||), И (&&) и НЕ (!) в JavaScript и разберем, как эти логические операторы могут быть использованы в различных сценариях. Также вы узнаете, что из себя представляет концепция истинности в JavaScript.

Концепция истинности в JavaScript

Любое выражение в JavaScript может быть оценено как истинное или ложное. Существует понятие логического типа данных, который может принимать только два значения: true (истина) и false (ложь). Каждое значение в JavaScript может быть преобразовано в логический тип данных. Например, число 0, пустая строка, null, undefined и NaN являются ложными значениями, в то время как все остальные значения являются истинными.

При работе с логическими операторами в JavaScript важно понимать концепцию истинности, поскольку она влияет на то, как операторы оценивают выражения. Далее рассмотрим понятие логических операторов их виды.

Что такое логические операторы

Логические операторы JavaScript— это символы или ключевые слова в программировании, используемые для создания логических выражений, которые оцениваются либо как истина (true), либо как ложь (false). Эти операторы являются основой программирования. Они используются для принятия решений на основе истинности или ложности условия и для управления потоком выполнения.

В JavaScript есть три основных логических оператора: И (&&), ИЛИ (||) и НЕ (!). Их можно использовать в условных конструкциях, циклах и других конструкциях программирования, которые требуют принятия решений на основе истинности или ложности условия. Они позволяют контролировать ход выполнения программы.

Далее подробно разберем каждый из логических операторов.

Логическое И (&&)

Оператор И в JavaScript записывается в виде двух амперсандов и имеет следующий синтаксис:

operand1 && operand2… && operandN

Оператор И возвращает true, если все операнды истинны (true). Если хотя бы один операнд является ложным (false), то все выражение считается ложным.

Оценка истинности всего выражения производится по таким правилам:

• Осуществляется проверка на истинность каждого операнда слева направо.
• Операнды приводятся в булевое значение согласно концепции определения истинности. Например, true является true, 1 будет также true, непустая строка станет true, а пустая ('') преобразуется в false и т. д.
• Если при проверке встречается операнд, значение которого в булевом виде будет false, проверка останавливает на этом операнде. В этом случае выражение возвращает исходное значение этого операнда.
• В случае если все операнды истинны, выражение является истинным (true). Тогда выражение возвращает значение последнего операнда.

Пример с возвратом значения:

const res = 'summer' && null && 12;
console.log(res); // null, так как null преобразуется в false

const res = 'winter' && (2 > 1) && 12;
console.log(res); // 12, так как выражение true, возвращается последнее значение

Протестируем различные варианты операндов в консоли разработчика:

console.log(true && true); // true
console.log(true && false); // false
console.log(false && true); // false
console.log(false && false); // false
console.log(true && false && true); // false
console.log(true && true && true); // true
console.log(true && 10 && 'someString'); // 'someString'
console.log(null && 'someString1' && 'someString2'); // null
console.log('someString' && undefined); // undefined
console.log(3 > 2 && 'someString' ); // 'someString' 

Для упрощенного понимания работы оператора И создадим таблицу истинности для него. Операнды обозначены полужирным начертанием: первый операнд в левом столбце, второй — в верхней строке. Результат выражения отображается на пересечениях столбца и строки операндов:

&&	true	false
true	true	false
false	false	false

Оператор И очень часто используется в условных конструкциях. Рассмотрим пример с конструкцией if. Допустим, у нас есть две булевые переменные isLoggedIn и isAdmin, которые определяют, соответственно, авторизован ли пользователь и имеет ли он права администратора. Если значения обеих переменных равны true (пользователь авторизован и является администратором), выполняется код условия if. Иначе работает код оператора else:

if (isLoggedIn && isAdmin) {
    // разрешить доступ с правами администратора
} else {
    // редирект на страницу авторизации
}

Разберем еще один пример. Предположим, мы ожидаем, что в переменной someArray должен храниться массив. И если этот массив содержит некоторые данные, нужно их обработать. При этом в определенной ситуации переменная someArray может быть не определена. Поэтому мы проверим два условия с помощью оператора И: переменная определена и содержит непустой массив. В случае истинности условия выполним действия над массивом, иначе пропустим код обработки:

let someArray = [];

if (someArray && someArray.length) {
    console.log('Массив непустой. Обрабатываем его содержимое');
}

В нашем случае переменная определена, но массив не содержит значений. Следовательно, someArray.length вернет 0, которое преобразуется в булевое false, и все выражение будет false. Поэтому код в теле конструкции if не выполнится.

Далее рассмотрим логическое ИЛИ.

Логическое ИЛИ (||)

Оператор ИЛИ представляет собой две вертикальные черты. Синтаксис оператора в JavaScript выглядит так:

operand1 || operand2… || operandN

Оператор ИЛИ возвращает значение true, если хотя бы один из операндов является истиной (true). Если все операнды ложны (false), то и все выражение будет ложным.

Правила оценки истинности всего выражения, состоящего из логических ИЛИ:

• Проверяется на истинность каждый операнд слева направо.
• Во время проверки операнды конвертируются в булевые значения исходя из концепции истинности.
• Если встречается операнд, приведенное булевое значение которого true, происходит остановка проверки на текущем операнде. При этом выражение возвращает исходное значение этого операнда.
• Если все операнды ложные (false), все выражение считается ложным. При ложности всего выражения возвращается последний операнд.

Пример с возвратом значения:

const res = 'summer' || null || 12;
console.log(res); // 'summer' как первый операнд с true

const res = null || (2 < 1) || undefined;
console.log(res); //  undefined, так как это булевое значение последнего операнда ложного выражения

Приведем несколько примеров с оператором ИЛИ:

console.log(true || true); // true
console.log(true || false); // true
console.log(false || true); // true
console.log(false || false); // false
console.log(true || false || true); // true
console.log(true || true || true); // true
console.log(true || 10 || 'someString'); // true
console.log(null || 'someString1' || 'someString2'); // 'someString1' 
console.log('someString' || undefined); // 'someString'
console.log(3 > 2 || 'someString' ); // true

Таблица истинности для оператора ИЛИ:

||	true	false
true	true	true
false	true	false

Рассмотрим пример с условной конструкцией if, когда нужно проверить, является ли пользователь администратором или модератором. У нас есть две булевые переменные. Одна, isAdmin, определяет, является ли пользователь администратором. Вторая, isModerator, имеет ли пользователь права модератора. Если пользователь является либо администратором, либо модератором (обе переменные true), то срабатывает код условия if. В противном случае запретим доступ:

if (isAdmin || isModerator) {
    // допустить с правами модератора
} else {
    // выдать ошибку
}

Так как оператор ИЛИ возвращает первое истинное значение, это эту особенность можно использовать в определенных ситуациях. Например, у нас есть перечень переменных и необходимо найти первую переменную, содержащую данные:

let firstName = '';
let lastName = '';
let nickname = 'greg_385';
let displayName = firstName || lastName || nickname;

console.log(displayName); // 'greg_385'

В этом примере мы ищем первую переменную с непустым значением. Так как firstName и lastName содержат пустые строки, то в displayName получим 'greg_385'.

Далее разберем оператор НЕ.

Оператор НЕ (!)

Оператор НЕ в JavaScript — это унарный оператор, возвращающий противоположное логическое значение операнда. Этот оператор представляет собой восклицательный знак перед операндом. Синтаксис оператора НЕ очень простой:

!operand

Оценка истинности при использовании оператора НЕ происходит так:

• Выражение после операнда приводится к булевому типу (true или false).
• Возвращается противоположное значение.

Примеры:

console.log(!true); // false
console.log(!10); // false
console.log(!''); // true
console.log(!'someString'); // false
console.log(!(8 > 6)); // false

Приведем пример с использованием оператора НЕ в условных конструкциях. Допустим, у нас есть переменная isLoggedIn, которая содержит true, если пользователь авторизован, и false в обратном случае. Мы хотим выполнить некоторый код, когда пользователь не авторизован. В этом случае нам достаточно инвертировать значение переменной isLoggedIn:

if (!isLoggedIn) {
    // редирект на страницу авторизации
}

Оператор НЕ в JavaScript может быть полезен для преобразования значения в булевый тип. В таком случае используется двойной оператор НЕ (!!). То есть с помощью первого восклицательного знака (!) значение конвертируется в противоположное булевое. Затем второй восклицательный знак инвертирует полученное значение.

Пример:

let strVal = "anything";
let numVal = 54;
let undefinedVal;

console.log(!!strVal); // true
console.log(!!numVal); // true
console.log(!!undefinedVal); // false

Комбинирование и приоритет операторов

Операторы И, ИЛИ и НЕ в JavaScript можно комбинировать — использовать в одном выражении. При этом важно знать приоритетах выполнения операторов, чтобы не допускать ошибок при составлении выражения.

Среди трех исследуемых операторов наивысший приоритет у оператора НЕ. После него идет оператор И. Логическое ИЛИ имеет низший приоритет. Это означает, что при проверке выражения на истинность, сперва проверяются операторы НЕ, затем операторы И, в последнюю очередь — операторы ИЛИ.

Рассмотрим пример, где определим, имеет ли человек право на покупку дома исходя из того, женат ли он (isMarried) и имеет ли детей (hasKids):

let isMarried = true;
let hasKids = false;
let canBuyHouse = !isMarried || isMarried && hasKids;

console.log(canBuyHouse); // false

Выражение оценивается следующим образом:

• Сначала оценивается !isMarried, потому что ! имеет более высокий приоритет, чем || и &&. Оператор ! отрицает значение isMarried, которое является true, и становится false.
• Далее оценивается isMarried && hasKids, потому что && имеет более высокий приоритет, чем ||. Поскольку hasKids является false, это выражение оценивается как false.
• Наконец, оценивается !isMarried || isMarried && hasKids на основе результатов двух предыдущих выражений. Поскольку и !isMarried, и isMarried && hasKids являются false, результат всего выражения — false. Следовательно, canBuyHouse присваивается значение false.

Для управления приоритетом выполнения операторов можно пользоваться скобками, которые имеют наивысший приоритет над тремя рассматриваемыми операторами:

let isMarried = true;
let hasKids = false;
let salary = 50000;
let canBuyHouse = !isMarried || isMarried && (hasKids || salary > 40000);

console.log(canBuyHouse); // true

В примере выше выражение в скобках посчитается в первую очередь. Если человек женат (isMarried), то он будет иметь право на покупку дома либо при наличии детей (hasKids), либо имея зарплату больше 40000 (salary > 40000).

Заключение

Таким образом, логические операторы JavaScript являются важной частью языка программирования JavaScript, поскольку они позволяют создавать условия и контролировать выполнение программы в зависимости от логических значений.

В этой статье мы рассмотрели основные логические операторы в JavaScript — операторы И (&&), ИЛИ (||) и НЕ (!), а также концепцию истинности. Знание особенностей логических операторов и правильное их применение позволяет писать более эффективный и чистый код.