Skip to content

Commit d69eea8

Browse files
authored
Merge pull request #443 from serhiiIgnatenko/patch-3
Update article.md
2 parents 569624e + eb998ac commit d69eea8

File tree

1 file changed

+5
-5
lines changed
  • 1-js/04-object-basics/07-optional-chaining

1 file changed

+5
-5
lines changed

1-js/04-object-basics/07-optional-chaining/article.md

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -32,7 +32,7 @@ alert(user.address.street); // помилка!
3232
let html = document.querySelector('.elem').innerHTML; // помилка оскільки null
3333
```
3434

35-
Для закріплення. Якщо елемента немає на вебсторінці, ми отримаємо помилку при спробі доступитися до властивості `.innerHTML` від `null`. І в деяких випадках, коли відсутність елемента для нас є нормою, ми хотіли б просто отримати `.innerHTML = null` (тобто `html = null`).
35+
Для закріплення. Якщо елемента немає на вебсторінці, ми отримаємо помилку при спробі доступу до властивості `.innerHTML` від `null`. І в деяких випадках, коли відсутність елемента для нас є нормою, ми хотіли б просто отримати `.innerHTML = null` (тобто `html = null`).
3636

3737
Як ми можемо це реалізувати?
3838

@@ -64,7 +64,7 @@ let user = {}; // користувач без властивості "address"
6464
alert(user.address ? user.address.street ? user.address.street.name : null : null);
6565
```
6666

67-
Виглядає просто жахливо і нечитабельно
67+
Виглядає просто жахливо і нечитабельно.
6868

6969
Але не хвилюйтесь, існує кращий варіант реалізації такої задачі за допомогою логічного оператора `&&`:
7070

@@ -90,7 +90,7 @@ alert( user.address && user.address.street && user.address.street.name ); // und
9090
- працює як `value.prop`, якщо `value` існує,
9191
- інакше (коли `value` є `undefined/null`) воно повертає `undefined`.
9292

93-
Ось безпечний спосіб доступитись до властивості `user.address.street` за допомогою `?.`:
93+
Ось безпечний спосіб доступу до властивості `user.address.street` за допомогою `?.`:
9494

9595
```js run
9696
let user = {}; // користувач без властивості "address"
@@ -122,7 +122,7 @@ alert( user?.address.street ); // undefined
122122
````warn header="Не зловживайте опціональним ланцюжком"
123123
Нам слід використовувати `?.` тільки в тих ситуаціях коли ми припускаємо що значення може не існувати.
124124
125-
Наприклад, якщо по нашій логіці об’єкт `user` точно існує, але його властивість `address` є необов’язковою, тоді нам слід використовувати конструкцію `user.address?.street`. Проте аж ніяк не `user?.address?.street`.
125+
Наприклад, якщо за нашою логікою об’єкт `user` точно існує, але його властивість `address` є необов’язковою, тоді нам слід використовувати конструкцію `user.address?.street`. Проте аж ніяк не `user?.address?.street`.
126126
127127
Тоді якщо помилково змінна `user` виявиться пустою, ми побачимо програмну помилку і зможемо це виправити. В іншому випадку, якщо ми зловживаємо `?.`, помилки можуть замовчуватися там де це непотрібно й ускладнювати процес налагодження.
128128
````
@@ -184,7 +184,7 @@ userGuest.admin?.(); // нічого (немає такого методу)
184184

185185
Вже потім `?.()` перевіряє ліву частину: якщо функція `admin` існує, то вона виконається (у випадку з `userAdmin`). Інакше (для `userGuest`) обчислення припиниться без помилок.
186186

187-
Також існує синтаксис `?.[]`, якщо ми хочемо отримати доступ до властивості за допомогою квадратних дужок `[]`, а не через крапку `.`. Як і в решті випадків, таких спосіб дає змогу безпечно читати властивості об’єкту яких може не існувати.
187+
Також існує синтаксис `?.[]`, якщо ми хочемо отримати доступ до властивості за допомогою квадратних дужок `[]`, а не через крапку `.`. Як і в решті випадків, такий спосіб дає змогу безпечно читати властивості об’єкту яких може не існувати.
188188

189189
```js run
190190
let key = "firstName";

0 commit comments

Comments
 (0)