Запропонувати правку

Покращити цю статтю

Допрацюйте відповідь до «Що робить Object.assign()?». Ваші зміни проходять модерацію перед публікацією.

Потрібне підтвердження

Контент

Що ви змінюєте

Заголовок (UA)

Коротка відповідь (UA)

Показується над повною відповіддю для швидкого нагадування.

Відповідь (UA)

`Object.assign()` - це вбудований метод JavaScript, який використовується для **копіювання властивостей з одного або кількох об'єктів в інший об'єкт**.

Він дозволяє **об'єднувати об'єкти** і **створювати поверхневі копії**.

---

## Синтаксис

```javascript
Object.assign(target, ...sources)
```

| Параметр | Опис |
|---|---|
| `target` | Об'єкт, **в який копіюються** властивості |
| `sources` | Один або кілька об'єктів-**джерел**, з яких беруться властивості |

Повертає сам `target`.

---

## Простий приклад

```javascript
const user = { name: 'Alice' };
const details = { age: 25, city: 'Kyiv' };

Object.assign(user, details);

console.log(user);
// { name: 'Alice', age: 25, city: 'Kyiv' }
```

Усі властивості з `details` **скопійовані в** `user`.
Якщо ключі збігаються, значення **перезаписуються**.

---

## Приклад з перезаписом властивостей

```javascript
const a = { name: 'Alice', age: 25 };
const b = { age: 30, city: 'Kyiv' };

const result = Object.assign(a, b);

console.log(result); // { name: 'Alice', age: 30, city: 'Kyiv' }
console.log(a === result); // true (a змінено)
```

Важливо: `Object.assign()` **змінює перший аргумент (**`target`**)**.
Якщо не хочеш мутувати об'єкт - передавай порожній об'єкт як перший параметр:

```javascript
const merged = Object.assign({}, a, b);
```

---

## Клонування об'єкта

```javascript
const user = { name: 'Alice', city: 'Kyiv' };

const clone = Object.assign({}, user);

console.log(clone); // { name: 'Alice', city: 'Kyiv' }
console.log(clone === user); // false (різні об'єкти)
```

Це створює **поверхневу копію**:
вкладені об'єкти копіюються **за посиланням**, а не дублюються.

---

## Приклад із вкладеним об'єктом (shallow copy)

```javascript
const user = {
  name: 'Alice',
  address: { city: 'Kyiv' }
};

const clone = Object.assign({}, user);

clone.address.city = 'Lviv';

console.log(user.address.city); // "Lviv" - посилання одне!
```

Тобто `Object.assign()` робить **поверхневе копіювання**, а не глибоке.
Для глибокої копії краще використовувати `structuredClone()` або `_.cloneDeep()`.

---

## Приклад об'єднання кількох джерел

```javascript
const a = { x: 1 };
const b = { y: 2 };
const c = { z: 3 };

const merged = Object.assign({}, a, b, c);
console.log(merged); // { x: 1, y: 2, z: 3 }
```

Дозволяє об'єднувати **кілька об'єктів в один**.

---

## Можна копіювати значення з примітивів

```javascript
const target = {};
Object.assign(target, { a: 1 }, 'abc', null);

console.log(target);
// { '0': 'a', '1': 'b', '2': 'c', a: 1 }
```

Рядок `"abc"` поводиться як масив символів,
кожна буква стає властивістю `'0'`, `'1'`, `'2'`.

---

## Об'єднання з наявними об'єктами (частий прийом)

```javascript
const settings = { darkMode: false, lang: 'en' };
const userSettings = { darkMode: true };

const final = Object.assign({}, settings, userSettings);
console.log(final); // { darkMode: true, lang: 'en' }
```

Часто використовується для "злиття типових налаштувань" з користувацькими.

---

## Підсумок

| Що робить | Приклад | Поведінка |
|---|---|---|
| Копіює властивості з одного об'єкта в інший | `Object.assign(a, b)` | Мутує `a` |
| Створює поверхневу копію | `Object.assign({}, obj)` | Не мутує вихідний об'єкт |
| Об'єднує кілька об'єктів | `Object.assign({}, a, b, c)` | Останні перезаписують попередні |
| Глибоку копію не робить | - | Вкладені об'єкти копіюються за посиланням |

Markdown · перетягуйте зображення · ⌘B / ⌘I шорткати496 слів

Для рев’юера

Примітка для модератора (необов’язково)

Бачить лише модератор. Прискорює рев’ю.