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

Привет, друг!
Сегодня мы поговорим об опциональной цепочке '?.' в JavaScript.
Ты наверняка сталкивался с ситуациями, когда твой код выводил ошибки, если обращался к свойствам или методам несуществующих объектов. Это неприятно, но мы можем упростить себе жизнь с помощью опциональной цепочки '?.'.
Допустим, у нас есть объект "person", который содержит информацию о человеке:
const person = {
name: 'John',
age: 25,
hobbies: ['football', 'basketball']
};
И мы хотим вывести в консоль информацию о любимом хобби человека:
console.log(person.hobbies[0].toUpperCase());
Но если у нашего объекта нет свойства "hobbies", то вместо желаемого результата мы получим ошибку. Чтобы избежать этого, мы можем использовать опциональную цепочку '?.'.
console.log(person.hobbies?.[0]?.toUpperCase());
Здесь мы добавили оператор '?.' после свойства "hobbies" и индекса "[0]". Это означает, что если свойства "hobbies" или элемента с индексом "[0]" нет, то код не будет бросать ошибку, а вернет undefined.
Теперь наш код будет безопасно работать даже на объектах, которые не имеют нужных свойств.
Кроме того, опциональная цепочка '?.' также может использоваться для вызова методов объектов, которые могут не существовать:
const person = {
name: 'John',
age: 25,
greet() {
console.log(`Привет, меня зовут ${this.name}`);
}
};
person.unknownMethod?.(); // код не будет бросать ошибку, если метод не существует
Здесь мы вызываем несуществующий метод "unknownMethod" с помощью опциональной цепочки '?.'.
Если метод не существует, код не будет бросать ошибку и выполнение программы продолжится.
Вот и все, друг! Теперь ты знаешь, что такое опциональная цепочка '?.' и как использовать ее для безопасной работы с объектами в JavaScript.
Надеюсь, эта статья была полезной и интересной для тебя! Так что ставь лайк) 👍