Опциональная цепочка в Javascript

Опциональная цепочка – это способ безопасного доступа к вложенным свойствам без возникновения неприятной ошибки Uncaught TypeError: Cannot read property “something” of undefined.

Предположим, у нас есть объект типа

const user = {
    name: "Chris",
    details: {
        age: 30,
        email: "chris@xyz.com",
    }
}

const userAge = user.details.age; // 30
const userStreet = user.details.address.street; // Error !!!

Доступ к любому свойству несуществующего объекта приведет к ошибке. Мы можем легко устранить эту ошибку с помощью нескольких проверок, таких как

const userAddress = user.details.address ? user.details.address.street : null;

Это становится еще более уродливым, если есть больше вложенных свойств или если свойства верхнего уровня не существуют. Раньше для решения этой проблемы я использовал lodash _.get. Но теперь javascript предоставил нам опциональную цепочку для решения этой проблемы без использования дополнительных зависимостей. Это происходит следующим образом:

const userAddress = user.details.address?.street

Необязательная цепочка ?. останавливает оценку, если значение перед ?. не определено или равно null, и возвращает undefined. Это намного чище, чем то, что мы имели раньше. Также следует помнить, что ?. просто сохраняет значение, необязательное перед ним, а не после него. К свойствам после него обращаются регулярно.

Необязательная цепочка также работает с квадратными скобками и функциями, например:

obj?.[prop] -> возвращает obj[prop], если obj существует, иначе не определено.