?.

Выше показан необязательный оператор цепочки JavaScript.

Необязательная цепочка используется для доступа к свойству объекта или для вызова функции, такой как . Цепной оператор.

Но, в отличие от . Цепной оператор не выдает ошибку, когда ссылка на объект имеет нулевое значение (не определено или null), вместо этого он выполняет короткое замыкание и возвращает неопределенно .

Оператор цепочки и необязательный оператор цепочки, примеры кода

Давайте посмотрим на пример кода.

Ниже у нас есть объект с именем food, у которого есть ключ имени.

Мы пытаемся получить доступ к ключу marcos, который возвращает значение undefined, поскольку он не существует.

Затем мы пытаемся вызвать несуществующий ключ protein , который вызовет TypeError из-за того, что мы пытаемся получить доступ к несуществующему свойству.

let food = {
    name: 'Beef 🍖'
}

food.macros.protein 
/* Expected: Uncaught TypeError: 
Cannot read properties of undefined (reading 'protein')*/

Теперь мы будем использовать необязательную цепочку, чтобы предотвратить вышеуказанную ошибку.

Попытка получить доступ к ключу protein с помощью опциональной цепочки приводит к возврату undefined, а не к неожиданной TypeError.

let food = {
    name: 'Beef 🍖'
}

food.macros?.protein //Expected: undefined with no TypeError

Примеры использования дополнительного оператора цепочки

Необязательный оператор цепочки имеет несколько вариантов использования.

Основным из них будут глубоко вложенные объекты.

Без необязательных цепочек поиск глубоко вложенных ключей требует проверки ссылок для предотвращения ошибок типа.

Например, возьмем следующий вопрос от JSchallenger.

«Вернуть свойство вложенного объекта — Напишите функцию, которая принимает объект в качестве аргумента. В некоторых случаях объект содержит другие объекты с некоторыми глубоко вложенными свойствами. Вернуть свойство «b» объекта «a» внутри исходного объекта, если он существует. Если нет, вернуть undefined”

Решение этой проблемы без необязательных цепочек потребует от нас каждый раз вручную проверять объект, как в приведенном ниже решении, что нецелесообразно и может привести к ошибкам:

function myFunction(obj) {
    for (let [key, val] of Object.entries(obj)) {
        if (key === 'a') {
            if (obj[key]['b'] !== undefined) return obj[key]['b']
        }
        return undefined
    }
}

В приведенной выше функции мы преобразуем объект в массив с помощью Object.entries (), а затем проверяем, есть ли у объекта ключ a, если он есть, мы проверяем, есть ли у объекта [a] ключ b. key, иначе мы вернем undefined.

Теперь давайте использовать ?. Необязательный оператор цепочки.

function myFunction(obj) {
    return obj?.a?.b
}

Как видите, ?. Необязательный оператор цепочки обеспечивает гораздо более короткий и простой синтаксис, который легче читать — он гораздо менее подвержен ошибкам.

Краткое содержание

Выше мы обсуждали, как использовать ?. Необязательный оператор цепочки в JavaScript.

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

Это делает его полезным, так как обеспечивает гораздо более удобный способ проверки существования ключа объекта.

Ссылки

Если у вас есть какие-либо вопросы/предложения, вы можете связаться со мной ниже:

Линкедлн

Твиттер

Следуйте за мной на Medium: Люк Слоан-Балджер

Тебе понравилась эта статья? Обязательно поделитесь ею в социальных сетях. Спасибо!