こんにちは、おじさんです。
今日はJavaScriptで配列の要素を削除する方法について説明していきます。
また、配列の要素を追加する方法も説明したのでそちらも見てもらえると嬉しいです。
目次
配列の要素を削除する方法
まずは配列の要素を削除する関数を紹介していきます。
とりあえずテスト用の関数を用意します。
var array = ["一個目", "二個目", ""];
一つ目、shift
この関数は配列の先頭の要素を削除する関数です。
さっきの配列を使って説明していきます。
次に「shift」を使って配列の先頭の要素を削除する方法を説明していきます。
まず呼び出し方です。
配列.shift()
呼び出し方は配列名を書いた後に「shift」と書いてかっこで閉じればOKです。
え？簡単すぎ？
だから、さっきの配列で試してみると...
array.shift(); // => [2, 3]
みたいに出力されるはずです。
二つ目、pop
この関数は配列の最後の要素を削除してくれる関数です。
さっきの配列を使って説明していきます。
次に「pop」を使って実際に配列の要素を削除する方法を説明していきます。
まず呼び出し方です。
配列.pop()
こちらはshiftと一緒で万能君ですね。
だから、さっきの配列で試してみると...
array.pop() // => [1,2]
みたいに出力されるはずです。
三つ目、delete
この演算子は配列の指定したインデックスの要素を削除する演算子です。
便利すぎだろこのやろぉー
さっきの配列を使って説明していきます。
次に「delete」を使って実際に配列の要素を削除する方法を説明していきます。
まず呼び出し方です。
delete 配列[インデックス]
こちらはちょっと特殊で、関数ではなく演算子なのでかっことかがいらないんですね。
めんどくさい。
だから、さっきの配列で試してみると...
delete array[2] // => [1, 3]
みたいに出力されるはずです。
四つ目、splice
こちらはdeleteと似ていて、指定したインデックスから要素を削除することができます。
さっきの配列を使って説明していきます。
次に「splice」を使って実際に配列の要素を削除する方法を説明していきます。
まず呼び出し方です。
配列.splice(開始インデックス,どこまで削除するか)
spliceはインデックスを指定することでどこからどこまでの範囲を削除することができます。
やりますねぇ。
だから、さっきの配列で試してみると...
array.splice(0, 1) // => [3]
みたいに出力されるはずです。
まとめ
まとめです。
- 「shift」は配列の先頭の要素を削除する関数
- 「pop」は配列の最後の要素を削除する関数
- 「delete」は配列の指定したインデックスの要素を削除する演算子
- 「splice」は指定した範囲の要素を削除する関数
ここまでご高覧ありがとうございました。
