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

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

Допрацюйте відповідь до «Чому не можна копіювати об'єкт оператором =?». Ваші зміни проходять модерацію перед публікацією.

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

Контент

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

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

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

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

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

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

Оператор `=` **не копіює об'єкт**,
а лише **копіює посилання на нього в пам'яті**.
Тобто обидва імені (змінні) будуть **вказувати на той самий об'єкт**.

---

## Приклад

```javascript
const user = { name: 'Tim' };
const clone = user; // "копіюємо" об'єкт

clone.name = 'Oleh';

console.log(user.name);  // 'Oleh'
console.log(clone.name); // 'Oleh'
```

Зміна в `clone` змінила й `user`,
тому що **це той самий об'єкт у пам'яті**.

---

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

```javascript
Пам'ять:
┌────────────┐
│  { name: 'Tim' }  │
└──────┬─────┘
       │
       ├── user
       └── clone
```

І `user`, і `clone` - це **посилання** на той самий об'єкт.
Коли ти пишеш `const clone = user`, створюється **ще одне посилання**, а не нова копія.

---

## Чому так відбувається

У JavaScript є два типи даних:

| Тип даних | Як копіюється |
|---|---|
| **Примітиви** (`number`, `string`, `boolean`, `null`, `undefined`, `symbol`, `bigint`) | за значенням |
| **Посилальні** (`object`, `array`, `function`, `Map`, `Set` тощо) | за посиланням |

```javascript
let a = 5;
let b = a;
b = 10;

console.log(a); // 5 (копія значення)

const obj1 = { x: 1 };
const obj2 = obj1;
obj2.x = 2;

console.log(obj1.x); // 2 (посилання)
```

---

## Якщо тобі потрібна саме копія

Використай один зі способів:

| Що потрібно | Як зробити |
|---|---|
| Поверхнева копія | `{ ...obj }` або `Object.assign({}, obj)` |
| Глибока копія | `structuredClone(obj)` або `_.cloneDeep(obj)` |

Приклад:

```javascript
const user = { name: 'Tim' };
const clone = { ...user }; // створює новий об'єкт

clone.name = 'Oleh';

console.log(user.name);  // "Tim"
console.log(clone.name); // "Oleh"
```

Тепер об'єкти **незалежні**.

---

## Підсумок

| Що відбувається при `const b = a` | Пояснення |
|---|---|
| Примітиви (числа, рядки тощо) | Копіюється **значення** |
| Об'єкти, масиви, функції | Копіюється **посилання**, а не вміст |
| Зміна копії впливає на оригінал | Так, якщо це об'єкт |
| Як уникнути | Використовуй spread (`{ ...obj }`) або `structuredClone()` |

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

Для рев’юера

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

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