/
Программирование
/
Курс JavaScript
/

Результат логических выражений

JavaScript: Результат логических выражений

Посмотрите на код ниже и попробуйте угадать, что будет напечатано на экран?

console.log(0 || 1);

Правильный ответ:

1

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

Ниже пример с оператором И:

console.log(0 && 1);
0

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

В JavaScript есть два простых правила, по которым происходят преобразования:

  • 0, '', undefined, NaN, null приводятся к false. Эти значения называют falsy.
  • Всё остальное приводится к true

Этим активно пользуются в разработке, например, для определения значения по умолчанию:

const value = name || "";
// Примеры
234 || ""; // 234
"hexlet" || ""; // 'hexlet'
undefined || ""; // ''

Если name примет одно из falsy-значений, константе value будет присвоена пустая строка. В этом случае в последующем коде мы сможем работать с value как со строкой.

Но здесь есть потенциальный баг. Если name содержит falsy-значение, а присваивание константе value значений типа 0, undefined, NaN или null допустимо, то код выше начнет работать неверно:

// Упс
false || ""; // ''
0 || ""; // ''
undefined || ""; // ''

Для таких случаев в JavaScript есть отдельный оператор ??. Он тоже подставляет правый операнд вместо левого, но срабатывает только на null и undefined. Остальные falsy-значения он пропускает как обычные данные:

0 ?? 100; // 0
"" ?? 100; // ''
null ?? 100; // 100
undefined ?? 100; // 100

Поэтому когда значением по умолчанию подменяют именно «ничего», берут ??, а когда любое falsy-значение, берут ||.

Приведение типов объясняет и то, зачем в JavaScript два вида сравнения. Кроме строгих операторов === и !==, в языке есть нестрогие == и !=. Отличаются они как раз преобразованием типов:

console.log("" === false); // => false
console.log("" == false); // => true

Пустая строка и false — это разные значения, поэтому оператор === говорит «ложь! они не равны!».

Но оператор == преобразует типы, и с его точки зрения пустая строка и false равны.

Это преобразование неявное, поэтому по возможности избегайте операторов == и !=.


Вспомните операцию отрицания:

const answer = true;
console.log(!answer); // => false

Отрицание работает внутри выражений:

!false || ""; // true

Если выражение обернуть в скобки и поставить перед ними !, то будет отрицание всего выражения:

// Выражение обернуто в скобки
console.log(!("" === false)); // => true
console.log(!("" == false)); // => false

При двойном отрицании !! итоговое значение равно начальному:

const answer = true;
console.log(!!answer); // => true

Но здесь дополнительно может происходить преобразование типа. Поэтому результатом двойного отрицания всегда будет значение типа boolean. Этим приемом иногда пользуются, чтобы поменять тип данных.

Ошибка выбора

Представьте себе задачу, в которой нам нужно проверить, что значение равно либо одному, либо другому. Например, переменная value должна содержать одно из двух значений: first или second. Начинающие разработчики иногда записывают это выражение так:

value === ("first" || "second");

В голове мы это себе примерно так и представляем, но языки работают по-другому, поэтому такой код приведет к неверному результату. Как его правильно прочитать? Мы должны вспомнить приоритет выполнения операций. Первым делом вычисляется все что указано в скобках, то есть 'first' || 'second'. Если выполнить этот код в repl, то вывод будет таким:

$ node
> 'first' || 'second'
'first'

Теперь мы можем заменить исходное выражение, на частично вычисленное:

value === "first";

Совсем не то, что мы ожидали. А теперь вернемся к началу, и напишем проверку правильно:

// Скобки ставить не обязательно,
// потому что приоритет === выше чем приоритет ||
value === "first" || value === "second";

Задание

Реализуйте функцию getLetter(), которая извлекает из переданной строки указанный символ (по порядковому номеру, а не по его индексу) и возвращает его наружу. Если такого символа нет, то функция возвращает пустую строку.

Примеры вызова:

const name = "Hexlet";

// Обычное обращение возвращает undefined
name[10]; // undefined

// 11 символ соответствует 10 индексу
getLetter(name, 11); // ''

getLetter(name, 1); // 'H'
getLetter(name, 0); // ''
getLetter(name, 6); // 't'

Полезное

Команда проекта находится в телеграм-сообществе. Там можно задать любой вопрос и повлиять на проект

Нашли ошибку? Есть что добавить? Пулреквесты приветствуются