Как работает необязательная цепочка в TypeScript?

Необязательная цепочка (optional chaining) — это полезная функция в TypeScript и JavaScript, которая позволяет обращаться к вложенным свойствам объектов или элементам массивов без необходимости проверки их существования на каждом уровне. Это особенно удобно, когда вы не уверены, существуют ли вложенные объекты в структуре данных, и позволяет избежать ошибок исполнения, связанных с обращением к undefined или null.

Пример использования

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

interface User {
    name: string;
    contact?: {
        email?: string;
        phone?: string;
    };
}

const user: User = {
    name: "Иван",
    contact: {
        email: "ivan@example.com"
    }
};

В этом примере объект user может не содержать свойства contact или свойство email внутри него. Если мы хотим получить адрес электронной почты, мы могли бы использовать следующую конструкцию, чтобы избежать ошибок:

const email = user.contact && user.contact.email;
console.log(email); // Output: "ivan@example.com" или undefined

Использование необязательной цепочки

С помощью необязательной цепочки этот код можно упростить:

const email = user.contact?.email;
console.log(email); // Output: "ivan@example.com" или undefined

Здесь ?. означает, что если свойство contact существует и не равно null, то будет получено значение email. В противном случае будет возвращено undefined, что исключает возможность обращения к свойству email у undefined.

Более сложный пример

Допустим, у нас есть массив пользователей, и мы хотим получить адрес электронной почты каждого пользователя:

const users: User[] = [
    {name: "Иван", contact: {email: "ivan@example.com"}},
    {name: "Мария"}, // у Марии нет свойств contact
    {name: "Петр", contact: {email: "petr@example.com", phone: "1234567890"}}
];

users.forEach(user => {
    const email = user.contact?.email ?? "Email не доступен";
    console.log(`${user.name}: ${email}`);
});

В этом примере мы используем необязательную цепочку и оператор нулевого слияния (??), чтобы предоставить сообщение по умолчанию в случае, если адрес электронной почты недоступен. Результат будет следующим:

Иван: ivan@example.com
Мария: Email не доступен
Петр: petr@example.com

Заключение

Необязательная цепочка — это мощный инструмент в TypeScript, который упрощает работу с вложенными объектами и структурами данных. Она значительно повышает читаемость кода и помогает избежать множества проверок на undefined или null. Использование этой функции может помочь новичкам в разработке более устойчивого и чистого кода.