今回はJavaScriptのメソッドである「.splice()メソッド」の使い方について簡単に解説したいと思います。配列の内容を変更する際によく使われるメソッドです。
.splice()メソッドとは
.splice()メソッドとは、古い要素の削除しながら新しい要素を追加することで配列の内容を変更できるメソッドです。
.splice()メソッドの記述方法は、以下の通りです。
array.splice(index , howMany[, element1[, ...[, elementN]]])
- indexで配列の変更を開始するインデックスを指定
- howManyで削除する古い配列要素の数を指定
- elementで追加する配列を指定
.splice()メソッドの使い方
では実際に「.splice()メソッド」の使い方を見ていきましょう。
var vegetables = ["carrot", "onion", "greenpepper", "eggplant"];
// インデックス2番目から、0個の要素を削除し、"cabbage"を挿入
var removed = vegetables.splice(2, 0, "cabbage")
// ["carrot", "onion", "cabbage", "greenpepper", "eggplant"]
// インデックス3番目から、1つの要素を削除
removed = vegetables.splice(3, 1);
// ["carrot", "onion", "cabbage", "eggplant"]
// インデックス2番目から1つの要素を削除し、"tomato"を挿入
removed = vegetables.splice(2, 1, "tomato");
// ["carrot", "onion", "tomato", "eggplant"]
// インデックス0番目から2つの要素を削除し、"cucumber","radish","spinach"を挿入
removed = vegetables.splice(0, 2, "cucumber", "radish", "spinach");
// ["cucumber", "radish", "spinach", "tomato", "eggplant"]
// インデックス3番目から、2つの要素を削除
removed = vegetables.splice(3, Number.MAX_VALUE);
// ["cucumber", "radish", "spinach"]
まとめ
- .splice()メソッドとは、古い要素の削除しながら新しい要素を追加できるメソッド
- 古い要素の削除のみも可能
今回はJavaScriptのメソッドである「.splice()メソッド」の使い方について簡単に解説しました。配列を操作するメソッドはまだまだたくさんあるので、1つ1つ学習していきましょう。
↓JavaScript関連メソッド

【JavaScriptメソッド】.shift()メソッドの使い方について簡単に解説! 今回はJavaScriptのメソッドである「.shift()メソッド」の使い方について簡単に解説したいと思います。似たよ...

【JavaScriptメソッド】配列に要素を追加する.push()メソッドの概要とその使い方JavaScriptのメソッドである「pushメソッド」の使い方について解説しています。配列に要素を追加するだけでなく、要素数を返す「.length()メソッド」のような機能もあるので、例題を用いながら理解を深めていきましょう。...