Метод copyWithin()

JavaScriptMiddle~2 хв читання

copyWithin() це метод масиву, який копіює частину його елементів в інше місце всередині цього самого масиву, не змінюючи довжини. Він мутує масив на місці і повертає посилання на нього, тому працює як дешевий «зсув» даних без виділення нового масиву.

Теорія

TL;DR

arr.copyWithin(target, start, end) копіює зріз [start, end) у позицію target того самого масиву.
Метод мутує вихідний масив і повертає його ж (this), а не копію.
Довжина масиву ніколи не змінюється: зайві елементи просто не вставляються.
end необов'язковий: без нього копіювання йде до кінця масиву.
Індекси можуть бути від'ємними, тоді відлік іде з кінця масиву.
Типове застосування це зсув значень у буфері без створення нового масиву.

Швидкий приклад

javascript

const arr = [1, 2, 3, 4, 5];
arr.copyWithin(0, 3);

console.log(arr); // [4, 5, 3, 4, 5]

Синтаксис і параметри

javascript

arr.copyWithin(target, start, end);

Параметр	Опис
`target`	Індекс, куди будуть скопійовані елементи
`start`	Індекс, звідки починати копіювання (включно)
`end`	Індекс, де закінчити (цей індекс не включається). Необов'язковий. Якщо не вказати, копіює до кінця масиву

Приклад 1: базовий

javascript

const arr = [1, 2, 3, 4, 5];
arr.copyWithin(0, 3);

console.log(arr); // [4, 5, 3, 4, 5]

Розшифровка:

target = 0, тобто вставляємо з позиції 0.
start = 3, тобто починаємо копіювати з індексу 3.
Копіюємо [4, 5].
Результат: [4, 5, 3, 4, 5].

Приклад 2: з start і end

javascript

const arr = [1, 2, 3, 4, 5];
arr.copyWithin(1, 3, 5);

console.log(arr); // [1, 4, 5, 4, 5]

Копіюємо елементи [4, 5] (від індексу 3 до 5, не включаючи 5).
Вставляємо з позиції 1.

Приклад 3: від'ємні індекси

javascript

const arr = [10, 20, 30, 40, 50];
arr.copyWithin(-2, 0, 2);

console.log(arr); // [10, 20, 30, 10, 20]

-2 означає «вставити починаючи з другого елемента з кінця».
Копіюємо [10, 20] і вставляємо в кінець.

Особливості поведінки

Властивість	Опис
Мутує масив	Так
Повертає	Змінений масив
Довжина масиву	Не змінюється
Копіює всередині масиву	Так
Значення, що повертається	Посилання на той самий масив (`this`)

Практичне застосування: зсув значень усередині масиву без створення нового.

javascript

const buffer = [1, 2, 3, 4, 5];
buffer.copyWithin(1, 0, 3);
console.log(buffer); // [1, 1, 2, 3, 5]

Коротко

Питання	Відповідь
Що робить	Копіює частину масиву в інше місце всередині нього
Чи змінює вихідний масив	Так
Що повертає	Сам масив
Чи змінює довжину	Ні, довжина стала
Приклад	`[1, 2, 3, 4, 5].copyWithin(0, 3)` дає `[4, 5, 3, 4, 5]`

Підсумок: copyWithin() це спосіб перемістити або продублювати елементи всередині масиву без створення нового масиву і без зміни довжини.

Типові помилки

Чекати, що метод поверне новий масив. Він мутує вихідний і повертає посилання на нього, тому const copy = arr.copyWithin(0, 3) дасть той самий масив, а не копію.
Думати, що масив стане довшим або коротшим. Довжина фіксована: усе, що не вміщується, просто відкидається.
Плутати copyWithin() зі slice() або splice(): slice() повертає новий масив і нічого не мутує, splice() змінює довжину.
Забувати, що end не включається: copyWithin(1, 3, 5) бере елементи з індексами 3 і 4, а не 3, 4 і 5.
Не враховувати від'ємні індекси і отримувати несподіваний результат: -1 це останній елемент, а не «на один перед початком».
Застосовувати метод до масиву, на який десь є ще одне посилання, і дивуватися зміненим даним в іншому місці коду.

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

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

Premium

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