Главная - Дополнительные основы JavaScript - Оператор опциональной цепочки (?.) ES11

Оператор опциональной цепочки (?.) ES11

Размещено в категории "Дополнительные основы JavaScript"
06.10.2024 / просмотров: 35 / комментариев: 0

Ресурсы:

Документация

Обозначается ?.

Пример работы 1:

Получим элементы со страницы:

Код

const box = document.querySelector('.box'),
block = document.querySelector('.block');

А теперь вывод в консоль с проверкой условия оператором ?.

Код

console.log(block?.textContent);

Оператор проверяет на true выражение слева от себя, если оно правдиво, код продолжает работу и присоединяется свойство textContent, если выражение слева false, код прекращает свою работу и возвращает undefined.

Пример 2:

Проверим, есть ли в данном объекте свойство skills

Код

const userData = {
name: "Alex",
age: null
}

console.log(userData.skills?.js); // undefined

а раньше бы пришлось прописывать такое длинное условие проверки:

Код

if (userData && userData.skills && userData.skills.js) {
console.log(userData.skills.js);
}

Пример 3

Дополним наш объект методом:

Код

const userData = {
  name: "Alex",
  age: null,
  say: function () {
  console.log('Hello');
  }
}

Проверяем на вызов несуществующего в объекте метода:

Код

userData.hey?.(); // undefined

Проверяем на вызов существующего в объекте метода:

Код

userData.say?.(); // Hello

Оператор проверит левую часть, если такой метод в объекте будет найден, то произойдёт его вызов, если нет - код прекратит работу и вернёт undefined

Всего комментариев: 0

Добавлять комментарии могут только зарегистрированные пользователи.