Skip to main content

Поверхнева копія масиву

JavaScriptJunior~1 хв читання
Запропонувати правку

Що таке "поверхнева копія"

Поверхнева копія (shallow copy) - це новий масив, у якого:

  • є нове посилання (зміни в ньому не торкнуться оригіналу);
  • але вкладені об'єкти копіюються за посиланням.

1. Через оператор розповсюдження (spread ...) - найсучасніший спосіб

javascript
const arr = [1, 2, 3]; const copy = [...arr]; console.log(copy); // [1, 2, 3] console.log(copy === arr); // false (новий масив)

Такий спосіб робить поверхневу копію - якщо елементи були об'єктами, вони все ще посилаються на ті самі дані:

javascript
const arr = [{ name: "Tim" }]; const copy = [...arr]; copy[0].name = "Alex"; console.log(arr[0].name); // "Alex" - бо об'єкт спільний

2. Через slice() без аргументів

javascript
const arr = [1, 2, 3]; const copy = arr.slice(); console.log(copy); // [1, 2, 3]
  • slice() без параметрів повертає новий масив - копію всього вихідного.
  • Це старий, але надійний спосіб.

3. Через Array.from()

javascript
const arr = [1, 2, 3]; const copy = Array.from(arr); console.log(copy); // [1, 2, 3]

Корисно, якщо ти хочеш не просто копію, а, наприклад, застосувати перетворення до кожного елемента:

javascript
const doubled = Array.from(arr, x => x * 2); // [2, 4, 6]

4. Через concat()

javascript
const arr = [1, 2, 3]; const copy = [].concat(arr); console.log(copy); // [1, 2, 3]

Працює тому, що concat() повертає новий масив, а не змінює вихідний.

Що не копіюється глибоко

Усі перелічені методи копіюють тільки верхній рівень. Якщо в масиві є об'єкти або вкладені масиви, вони залишаться за посиланням.

javascript
const arr = [[1, 2], [3, 4]]; const copy = [...arr]; copy[0][0] = 99; console.log(arr[0][0]); // 99 - бо вкладений масив спільний

Коротко:

СпосібКодСтворює новий масивГлибока копія?
Spread[...arr]ТакНі
slice()arr.slice()ТакНі
Array.from()Array.from(arr)ТакНі
concat()[].concat(arr)ТакНі

Підсумок: Щоб зробити поверхневу копію масиву, використовуй:

javascript
const copy = [...arr];

А якщо потрібне глибоке копіювання (разом із вкладеними об'єктами) - можна використовувати structuredClone(arr) або JSON.parse(JSON.stringify(arr)).

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

Для співбесіди
Premium

Коротка відповідь допоможе вам впевнено відповідати на цю тему під час співбесіди.

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