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

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

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

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

Контент

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

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

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

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

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

## Коротка відповідь

При копіюванні за допомогою `Object.assign()`
створюється **поверхнева копія (shallow copy)**.
Це означає, що **вкладені об'єкти й масиви копіюються за посиланням**, а не за значенням.

---

## Приклад

```javascript
const user = {
  name: 'Богдан',
  address: {
    city: 'Київ',
    zip: 12345
  }
};

const clone = Object.assign({}, user);
clone.address.city = 'Львів';

console.log(user.address.city); // 'Львів'
```

Чому так:

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

---

## Як це виглядає в пам'яті

```javascript
user.address ─────┐
                   │  (один і той самий об'єкт)
clone.address ────┘
```

Обидва об'єкти (`user` і `clone`) **посилаються на один і той самий** `address`.
Тому зміна всередині `address` торкається обох.

---

## Але! Примітивні властивості копіюються нормально

```javascript
const user = { name: 'Богдан', age: 25 };
const clone = Object.assign({}, user);

clone.name = 'Олег';
console.log(user.name); // "Богдан" (незалежно)
```

Лише **вкладені об'єкти або масиви** продовжують бути спільними.

---

## Як уникнути цієї проблеми

Якщо хочеш зробити **глибоку копію**, використовуй:

### `structuredClone()` (вбудований сучасний спосіб)

```javascript
const clone = structuredClone(user);
clone.address.city = 'Львів';
console.log(user.address.city); // "Київ"
```

### `JSON.parse(JSON.stringify())` (універсально, але з обмеженнями)

```javascript
const clone = JSON.parse(JSON.stringify(user));
```

### `_.cloneDeep()` з Lodash (надійно і сумісно з усіма типами)

```javascript
import _ from 'lodash';
const clone = _.cloneDeep(user);
```

---

## ПІДСУМОК

| Що копіює `Object.assign()` | Поведінка |
|---|---|
| Примітивні значення (`string`, `number`, `boolean`) | копіюються за значенням |
| Вкладені об'єкти й масиви | копіюються **за посиланням** |
| Функції | копіюються за посиланням |
| Глибокі структури | не копіюються незалежно |

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

Для рев’юера

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

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