Запропонувати правкуПокращити цю статтюДопрацюйте відповідь до «Неіснуюча властивість об'єкта». Ваші зміни проходять модерацію перед публікацією.Потрібне підтвердженняКонтентЩо ви змінюєте🇺🇸EN🇺🇦UAПереглядЗаголовок (UA)Коротка відповідь (UA)**Звернення до неіснуючої властивості об'єкта** не спричиняє помилки: результатом буде `undefined`. **Ключове:** помилка з'являється лише тоді, коли ви намагаєтесь звернутися до властивості ще глибше, на значенні, що вже дорівнює `undefined`.Показується над повною відповіддю для швидкого нагадування.Відповідь (UA)Зображення## Коротка відповідь Якщо звернутися до **неіснуючої властивості об'єкта**, то **помилки не буде**, а результатом стане `undefined`. --- ## Приклад ```javascript const user = { name: 'Oleh' }; console.log(user.name); // "Oleh" console.log(user.age); // undefined console.log(user.address); // undefined ``` > JavaScript не видає помилку, а просто повертає `undefined`. --- ## Чому так відбувається JS при зверненні до властивості: 1. Перевіряє, чи є вона **в об'єкті**. 2. Якщо **є** → повертає її значення. 3. Якщо **немає** → повертає `undefined`. Тобто: ```javascript user.hasOwnProperty('age'); // false user.age; // undefined ``` --- ## Але важливо: помилка з'явиться, якщо звернутися далі по ланцюжку ```javascript console.log(user.address.city); // TypeError ``` > Чому? > `user.address` - це `undefined`, > а у `undefined` **не можна запитувати властивості** (`city`). --- ## Як уникнути помилки при доступі до вкладених властивостей ### Спосіб 1. Ручні перевірки ```javascript if (user.address && user.address.city) { console.log(user.address.city); } ``` --- ### Спосіб 2. Оператор опціонального ланцюжка `?.` (сучасний спосіб) ```javascript console.log(user.address?.city); // undefined (але без помилки!) ``` > Якщо зліва від `?.` є `null` або `undefined`, > JS **зупиняє обчислення** і повертає `undefined`. --- ### Спосіб 3. Використати типове значення через `??` ```javascript console.log(user.address?.city ?? 'Не вказано'); // "Не вказано" ``` --- ## Приклад з динамічним ключем ```javascript const key = 'email'; console.log(user[key]); // undefined (якщо властивості немає) ``` > Навіть при динамічному доступі через `[]` поведінка та сама, просто `undefined`. --- ## Відмінність від інших випадків | Ситуація | Результат | Пояснення | |---|---|---| | `user.age` | `undefined` | Властивість відсутня | | `user.age.city` | `TypeError` | `undefined` не є об'єктом | | `'age' in user` | `false` | Перевірка наявності властивості | | `user.hasOwnProperty('age')` | `false` | Перевірка лише власних властивостей | | `user.name ?? 'ні'` | `'Oleh'` | Повертає значення | | `user.age ?? 'ні'` | `'ні'` | Типове значення | --- ## Підсумок | Поведінка | Що робить | |---|---| | `obj.missing` | повертає `undefined` | | Помилки немає | навіть якщо властивості немає | | Помилка з'являється | при спробі звернутися глибше (`undefined.city`) | | Рішення | використати `?.` або `??` | --- ### Приклад для закріплення ```javascript const user = { name: 'Oleh' }; console.log(user.age); // undefined console.log(user.age?.value); // undefined (без помилки) console.log(user.age.value); // TypeError console.log(user.age ?? 'ні'); // "ні" ```Для рев’юераПримітка для модератора (необов’язково)Бачить лише модератор. Прискорює рев’ю.