Как работает опциональная цепочка (`?.`) в JavaScript и каковы её основные случаи использования?

Что такое Optional Chaining?

Optional chaining (?.) — это оператор JavaScript, который позволяет безопасно получать доступ к свойствам глубоко вложенных объектов. Если какая-либо ссылка в цепи равна null или undefined, выражение прерывает выполнение и возвращает undefined вместо того, чтобы выбросить ошибку TypeError.

Как это работает

Без optional chaining доступ к вложенному свойству требует ручной проверки на null:

С optional chaining это становится намного чище:

Поддерживаемый синтаксис

Optional chaining работает в трёх формах:

• Доступ к свойству: obj?.prop
• Вызов методов: obj?.method()
• Квадратные скобки: obj?.[key]

Основные варианты использования

• Получение доступа к глубоко вложенным свойствам объектов, где промежуточные значения могут не существовать
• Вызов опциональных методов, которые могут быть или не быть определены на объекте
• Чтение значений из ответов API, где гарантия наличия определённых полей отсутствует
• Работа с DOM-элементами, которые могут быть null, если они не найдены на странице

Важное поведение

Оператор прерывает выполнение только когда значение слева от него строго равно null или undefined. Любое другое falsy значение, такое как 0 или "", не приведёт к прерыванию выполнения.

Optional chaining часто комбинируют с оператором nullish coalescing (??), чтобы задать значение по умолчанию:

Это гарантирует, что при разрешении цепи в undefined будет возвращено безопасное значение по умолчанию.