配列内の要素を同じ配列内の別の要素にコピー - copyWithin

《初回公開：2023/10/19 , 最終更新：未》

copyWithinメソッドは配列内の要素を同じ配列内の別の要素領域にコピーするメソッド。
コピーはシャローコピーとなる。
配列内の要素の要素を変更するので破壊的メソッドという事になる。

構文

array.copyWithin(target, start, end)

引数

target: コピー先のインデックス値
start: 省略可能(省略時は最初の要素つまり0)コピー元のコピー開始インデックス
end: コピー終了インデックス。
省略可能(省略時は最後の要素つまりlength)
注意が必要なのはendで指定したインデックスの一つ前までがコピーされる事。
負の値を指定すると配列の最後のインデックスからの位置を示す。

配列のサイズを超えるコピーはできない、無視される。

以下のコードのインデックス2の位置に配列の要素をコピーする。
引数startとendが省略されているので、インデックス0の位置からの配列の全体をインデックス2の位置からコピーするが、配列のサイズを超えるコピーはできないので最後の要素は値cまでに。

const array = ["a", "b", "c", "d", "e"];
array.copyWithin(2);
console.log(array);    // ['a', 'b', 'a', 'b', 'c']

これを配列のサイズを変更してやれば最後までコピーできることになる。

const array = ["a", "b", "c", "d", "e"];
array.length +=2;

array.copyWithin(2);
console.log(array);    // ['a', 'b', 'a', 'b', 'c', 'd', 'e']

startとendの引数を指定してインデックス1の位置にインデックス3から5の一つ前までの値をコピー。

const array = ["a", "b", "c", "d", "e"];
array.copyWithin(1, 3, 5);
console.log(array);    // ['a', 'd', 'e', 'd', 'e']

end引数がstart引数と同じか小さい場合は無視されるようだ。(何もしない)

const array = ["a", "b", "c", "d", "e"];
array.copyWithin(1, 3, 2);
console.log(array);    // ['a', 'b', 'c', 'd', 'e']

copyWithinメソッドもarray-like objectに対して適用できて。

const arrayLikeObj = {
    0: "a",
    1: "b",
    2: "c",
    3: "d",
    4: "e",
    length: 5
};
Array.prototype.copyWithin.call(arrayLikeObj, 1, 3, 5);
console.log(arrayLikeObj);    // {0: 'a', 1: 'd', 2: 'e', 3: 'd', 4: 'e', length: 5}

空のスロットを含む配列の場合は、空のスロットはundefined値としてでは無く空のスロットのままコピーされる。

const array = ["a", , , "d", "e"];
array.copyWithin(2);
console.log(array);    // ['a', , 'a', ,]