Нова властивість в об'єкті
1. Через крапку (.)
javascript
const user = { name: 'Tim' };
user.age = 25; // додаємо нову властивість
console.log(user);
// { name: 'Tim', age: 25 }Працює, якщо ім'я властивості - валідний ідентифікатор (без пробілів, без спецсимволів, не починається з числа).
2. Через квадратні дужки ([])
javascript
const user = { name: 'Tim' };
user['city'] = 'Kyiv';
console.log(user);
// { name: 'Tim', city: 'Kyiv' }Цей спосіб підходить, якщо:
-
ключ зберігається у змінній:
javascriptconst key = 'email'; user[key] = 'tim@mail.com'; -
або містить невалідні символи:
javascriptuser['favorite color'] = 'blue';
3. За допомогою Object.assign()
javascript
const user = { name: 'Tim' };
Object.assign(user, { age: 25, city: 'Kyiv' });
console.log(user);
// { name: 'Tim', age: 25, city: 'Kyiv' }Можна одразу додати кілька властивостей. Метод змінює вихідний об'єкт.
4. За допомогою spread-оператора (...) - створює новий об'єкт
javascript
const user = { name: 'Tim' };
const updatedUser = { ...user, age: 25 };
console.log(updatedUser);
// { name: 'Tim', age: 25 }Вихідний об'єкт не змінюється - створюється нова копія (іммутабельний спосіб).
5. Через Object.defineProperty() (рідше, але гнучко)
javascript
const user = {};
Object.defineProperty(user, 'age', {
value: 25,
writable: true,
enumerable: true,
configurable: true
});
console.log(user); // { age: 25 }Дозволяє точно налаштувати властивість: зробити її, наприклад, тільки для читання або прихованою під час перебору.
ПІДСУМОК
| Спосіб | Змінює вихідний об'єкт | Підходить для |
|---|---|---|
obj.key = value | Так | простих випадків |
obj['key'] = value | Так | динамічних ключів |
Object.assign() | Так | масового додавання |
{ ...obj, key: value } | Ні | створення нового об'єкта |
Object.defineProperty() | Так | особливих налаштувань властивості |
Коротка відповідь
Для співбесідиPremium
Коротка відповідь допоможе вам впевнено відповідати на цю тему під час співбесіди.