Що таке Optional Chaining? | Основи JavaScript, епізод 19

Друзі, чи не набридли вам такі помилки?

Помилки, що виникають при зверненні до змінної, яка є null або undefined. Якщо не хочеш отримати помилку, доведеться писати if else для перевірки значення.

const nestedProp = obj.first && obj.first.second;  

const temp = obj.first;  

const nestedProp2 =  
 temp === null || temp === undefined ? undefined : temp.second;

Сьогодні я хочу вам запропонувати корисну функцію — Optional Chaining.

Optional Chaining — це функція, яка дозволяє безпечно звертатися до значень. Якщо значення є null або undefined, воно просто повертає undefined, не викликаючи помилки.

Давайте подивимося на приклад:

const cat = {  
 name: "Міа",  
 toys: ["м'яч", "коробка"],  
 hello: () => console.log('Міа')  
}

1. Використовуємо для доступу до значень в об'єкті

// 1  
const age = cat?.age

1. Використовуємо для доступу до значень в масиві

// 2  
const toy = cat?.toys?.[0]

1. Використовуємо для виклику функції

// 3  
cat?.hello?.()

1. Використовуємо для ланцюжка викликів

// 4  
cat?.age?.foo?.bar?.baz

1. Використовуємо для доступу до її серця?

// 5  
yourheart?.me // 404 not found

Ви також можете подивитися це у вигляді відео за посиланням

Перекладено з: Optional Chaining คืออะไร ? | พื้นฐาน JavaScript ep.19