JavaScript - 配列の要素を削除する時に、要素間を詰める方法

JavaScript で配列の要素の一部を削除する時、、要素間詰めるケースと、詰めないケースがあります。

要素を詰める場合はsplice() メソッド、詰めない場合は delete 演算子で実現できます。

ここでは、両方のケースのサンプルコードを紹介します。

要素間を詰める場合

splice() メソッドについて

配列の要素間を詰めて削除する場合は、splice() メソッドを使います。

第一引数で、配列を変化させる(削除する)開始インデックスを指定し、

第二引数で、削除する要素数を指定します。

第二引数がない場合は、第一引数で指定したインデックス以降の全ての要素が削除されます。

1つ削除して詰める場合

第二引数に「1」と指定します。


var arr = [1, 2, 3, 4, 5];

arr.splice(2, 1);

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

2つ削除して詰める場合

第二引数に「2」と指定します。


var arr = [1, 2, 3, 4, 5];

arr.splice(2, 2);

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


第二引数を省略した場合

第一引数で指定したインデックス以降のすべての要素が削除されます。


var arr = [1, 2, 3, 4, 5];

arr.splice(2);

console.log(arr); // Array [ 1, 2 ]

要素間を詰めない場合

配列の要素間を詰めずに削除する場合は、delete 演算子を使います。

引数として、配列名[インデックス] を指定。

delete 演算子を使った場合、指定要素に対して「undefined」を代入するのと同じです。


var arr = [1, 2, 3, 4, 5];

delete arr[1];

console.log(arr); // Array [ 1, <1 個の空行>, 3, 4, 5 ]

まとめ

実際に配列の途中の要素を削除する場合は、 splice() を使って要素間を詰めるケースが多いと思いますが、

delete 演算子を使えば、要素間を詰めずに削除することもできます。