🕌
[JavaScript]scliceについて
spliceメソッドとは
-
配列を表すArrayのメソッドで配列の要素を操作するメソッド。以下のような操作が可能。
- 要素を取り除く
- 置き換える
- 追加する
-
Arrayオブジェクトのsplice()メソッドを実行すると、第一引数で指定した位置から、第二引数で指定した数の要素が配列から削除され、第三引数以降で指定した値が要素として配列に追加される。
-
実行した結果には、削除された要素が配列形式で返る。
-
配列名.splice() …… 配列から要素を削除・追加して組み替える
構文・引数・戻り値
構文
配列名.splice()
第一引数
追加・削除する位置（配列の要素数より大きい値を指定すると配列の末尾となる。負の数値を指定すると配列の末尾から引いた位置となる）
第ニ引数
削除する要素の数
第三引数以降
追加する要素
戻り値
削除された要素が配列形式で返される
第1引数のみ
指定した要素以降を全て取り除くため、下記のように記述。
const array = ['1番目', '2番目', '3番目', '4番目', '5番目'];
array.splice(2); // ["1番目", "2番目"]
第1引数と第2引数を指定
第1引数で指定した要素から、第2引数で指定した数の分の要素を取り除く。
const array = ['1番目', '2番目', '3番目', '4番目', '5番目'];
array.splice(1,3); // ["1番目", "5番目"]
第1引数〜第3引数を指定
プログラムの動作は、第1引数で指定した要素から、第2引数で指定した数を取り除き、第3引数の値を追加する。
第2引数が0の場合は、1つも取り除かずに値を追加するため、間に要素を差し込む動作と同様。
const array = ['1番目', '2番目', '3番目', '4番目', '5番目'];
array.splice(1,0, '差し込み'); // ["1番目", "差し込み", "2番目", "3番目", "4番目", "5番目"]
第2引数が1の場合は、1つを取り除いて、第3引数を追加し、置き換える動作となる。
const array = ['1番目', '2番目', '3番目', '4番目', '5番目'];
array.splice(1, 1, '交換'); // ["1番目", "交換", "3番目", "4番目", "5番目"]
第1引数〜第5引数を指定
第3引数の追加する動作と同様。
この場合では、追加する値が第3引数、第4引数、第5引数の3つになる
const array = ['1番目', '2番目', '3番目', '4番目', '5番目'];
array.splice(1, 0, '差し込み1', '差し込み2', '差し込み3'); // ["1番目", "差し込み1", "差し込み2", "差し込み3", "2番目", "3番目", "4番目", "5番目"]
参考
Discussion