Я был заинтригован оператором Nullish Coalescing с тех пор, как услышал о нем, прежде всего потому, что он звучит очень причудливо X’D.
Я решил узнать о нем побольше. Отсюда и этот блог. Я постараюсь рассказать обо всем как можно проще и понятнее для новичков.
Итак, давайте приступим к делу!
Что такое «???» ?
Синтаксически оператор коалесценции nullish определяется как ‘??’.
По сути, он следит за «нулевыми» и «неопределенными» значениями.
Давайте разберемся в этом на примере.
Предположим, у нас есть следующее выражение:
Тогда значение фруктов будет зависеть от значения яблок. Если noOfApples равно null или undefined, то значение fruitCount будет равно noOfOranges. И наоборот, если значение noOfApples не равно null или undefined, то fruitCount будет равно noOfApples.
Подведем итог:
В выражении типа a??b результатом является:
По сути, это синтаксический сахар.
Общие случаи использования оператора Nullish Coalescing Operator
1) Присвоение переменной значения по умолчанию
Оператор nullish coalescing позволяет легко присвоить значение по умолчанию переменной, которой оно не было присвоено.
Например,
В приведенном выше примере, поскольку count не инициализирован значением, значение sum задается вторым операндом, который в данном случае равен 0.
2) Выбор из списка неопределенных/нулевых значений
Рассмотрим сценарий, в котором нам нужно вывести имя пользователя.
let firstName = null;
// shows the first defined value:
console.log(firstName ?? lastName ?? nickName ?? "User");
В приведенном выше примере Coldpigli записывается в журнал, поскольку firstName и lastName являются null, а nickName имеет "определенное" значение (в смысле "??").
Хорошо, но чем это отличается от '||'?
|| можно использовать как ??, но есть некоторые случаи, когда нужно остерегаться использования ||.
Важное различие между ними заключается в том, что:
- || возвращает первое истинное значение.
- ?? возвращает первое определенное значение.
Это означает, что || не может отличить false, 0, пустую строку "" и null/undefined.
Это может стать серьезной проблемой в случаях, когда мы хотим рассматривать 0 или false как значения, а не их отсутствие.
Давайте разберемся в этом на примере:
let count = 0;
console.log(count || 100); //100
console.log(count ?? 100); //0
Count 0 может быть вполне допустимым значением для переменной, которая что-то считает.count || 100 проверяет высоту на фальшивое значение, и это 0, которое является фальшивым.
поэтому результатом || будет второй аргумент, 100.
Функция count ?? 100 проверяет count на null/undefined, и это не так.
поэтому результатом будет count "как есть", то есть 0.
Использование ?? с && или ||
Javascript запрещает использовать ?? в сочетании с && или ||.
Поэтому выражение типа a = b && c || d приведет к синтаксической ошибке.
Однако есть способ обойти это.
Вы можете явно определить приоритет использования, используя (), например,
Вышеприведенное выражение является вполне корректным выражением Javascript.
Итак, на этом я заканчиваю этот блог. Надеюсь, оператор коалесценции nullish больше не кажется таким пугающим, как кажется.
До следующего раза, друзья!