Необязательная цепочка (?.)
Необязательный оператор цепочки (?.) обращается к свойству объекта или вызывает функцию. Если объект, к которому осуществляется доступ, или вызываемая функция не определены или имеют значение null, вместо ошибки будет возвращено значение undefined.
постоянный авантюрист = {
имя: «Алиса»,
кот: {
имя: Дина
}
};
const dogName = искатель приключений.собака?.имя;
console.log(имя собаки);
// ожидаемый результат: не определено
console.log(авантюрист.someNonExistentMethod?.());
// ожидаемый результат: не определено
const foo = {someFooProp: «привет» };
console.log(foo.someFooProp?.toUpperCase()); // ПРИВЕТ
console.log(foo.someBarProp?.toUpperCase()); // неопределенный
Нулевой оператор объединения (??)
1) Нулевой оператор объединения (??) является логическим оператором
Синтаксис
выражение1 ?? выражение2
Если выражение1 равно null или не определено, возвращает выражение2
В противном случае возвращает выражение2
неопределенный ?? «фу»; // возвращает «foo»
нулевой ?? «фу»; // возвращает «foo»
"привет" ?? «фу»; // возвращает «привет»
2) Возвращает свой правый операнд, если левый операнд равен нулю или не определен, и в противном случае возвращает свой левый операнд.
константа foo = null ?? «строка по умолчанию»;
console.log(foo);
// ожидаемый результат: «строка по умолчанию»
константа баз = 0 ?? 42;
console.log(баз);
// ожидаемый результат: 0 (поскольку 0 не является нулевым или неопределенным)
Нулевой оператор объединения (??) можно рассматривать как частный случай логического оператора ИЛИ (||).
|| возвращает правый операнд, если левый операнд является любым ложным значением, а не только нулевым или неопределенным.
Ниже приведены дополнительные примеры.
пусть фу;
// foo никогда не присваивается никакого значения, поэтому оно все еще не определено
const someDummyText = foo || 'Привет!';
console.log(некоторыйDummyText); // Привет!
Значение falsy (включая 0, ‘’, NaN, false и т. д.)
постоянный счетчик = 0;
постоянный текст = "";
константное количество = количество || 42;
постоянное сообщение = текст || "привет!";
console.log(кол-во); // 42 а не 0
console.log(сообщение); // "привет!" и не ""
Интересный пример
константный текст = ""; // Пустая строка (которая также является ложным значением)
const notFalsyText = мой текст || "Привет, мир";
console.log (не ложный текст); // Привет, мир
константное сохранениеFalsy = myText ?? «Привет, соседи»;
console.log(сохранение ложности); // '' (поскольку myText не является ни неопределенным, ни нулевым)
Связь с необязательным оператором цепочки (?.)
1) Нулевой оператор объединения (??) рассматривает undefined и null как конкретные значения.
2) Как и необязательный оператор цепочки (?.), который полезен для доступа к свойству объекта, которое может быть нулевым или неопределенным.
3) Комбинируя их, вы можете безопасно получить доступ к свойству объекта, которое может быть нулевым, и указать значение по умолчанию, если оно есть.
const foo = {someFooProp: «привет» };
console.log(foo.someFooProp?.toUpperCase() ?? «недоступно»); // "ПРИВЕТ"
console.log(foo.someBarProp?.toUpperCase() ?? «недоступно»); // "нет в наличии"
ПРИМЕЧАНИЕ
Нулевой оператор объединения имеет пятый низший приоритет оператора, непосредственно ниже, чем || и непосредственно выше, чем условный (тернарный) оператор.
Невозможно напрямую объединить операторы И (&&) и ИЛИ (||) с ??
ноль || неопределенный ?? «фу»; // вызывает SyntaxError
правда && не определено ?? «фу»; // вызывает SyntaxError
Вместо этого укажите круглые скобки, чтобы явно указать приоритет:
(нуль || не определено) ?? «фу»; // возвращает «foo»
Вы также можете посмотреть это на: https://www.youtube.com/watch?v=Q-hE-w3uF88