JavaScript | 配列をコピー・複製する方法

JavaScript 配列,JavaScript

JavaScript | 配列をコピー・複製する方法

JavaScriptで配列を新しい配列としてコピー・複製する方法を紹介しています。

配列をコピー・複製する動作サンプル

配列を元の配列を変更しない形で新しい配列のコピー(複製)する動作サンプルになります。

下記サンプルコードでは、スプレッド構文を使った方法、concat()メゾッドを使った方法、slice()メゾッドを使った方法それぞれを紹介しています。

動作サンプルはスプレッド構文を使った方法で表示しいますが、他の方法はコメントアウトしてありますので切り替えて確認可能です。

See the Pen JavaScript | Reverse the array by yochans (@yochans) on CodePen.

スプレッド構文で配列をコピー・複製する

スプレッド構文を使って配列をコピー(複製)する方法になります。

スプレッド構文はオブジェクトや配列のすべての要素を何らかのリストに入れる必要がある場合に使用できます。

配列を複製する場合は、以下のように記述する事が可能となっています。

let array_1 = [1, 2, 3, 4, 5];
let array_2 = [...array_1];

参考:スプレッド構文 – JavaScript | MDN

slice()メゾッドで配列をコピー・複製する

slice()メゾッドを使って配列をコピー(複製)する方法になります。

slice()メゾッドは開始位置と終了位置を指定して配列のコピーを作成する事が可能なメゾッドですが、未指定にする事で最初から最後までの値を取得して配列のコピーを作成する事もできます。

let array_1 = [1, 2, 3, 4, 5];
let array_2 = array_1.slice();

concat()メゾッドで配列をコピー・複製する

配列をコピー(複製)する方法のひとつにconcat()メゾッドを使った方法があります。

concat()メゾッドは2つの配列を結合する処理を実行しますが、引数を指定しない事で1つの配列を対象にします。

let array_1 = [1, 2, 3, 4, 5];
let array_2 = array_1.concat();