この記事ではJavaScriptで配列の要素を削除する方法について見ていきたいと思います。
配列の先頭の要素を削除する方法
配列の先頭の要素を削除するにはshift()を用います。
shift()の書き方
配列.shift()
shift()を用いた例
let arr1 = ["a", "b", "c", "d"];
arr1.shift();
console.log(arr1);ここでは、配列[“a”, “b”, “c”, “d”]の先頭の要素を削除するという内容になっていますね。
では結果を見てみると、
こうですね。
配列の先頭の要素である「a」が削除されていますね。
では次に配列の末尾の要素を削除する方法について見ていきましょう。
配列の末尾の要素を削除する方法
配列の末尾の要素を削除するにはpop()を用います。
pop()の書き方
配列.pop()
pop()を用いた例
let arr2 = ["a", "b", "c", "d"];
arr2.pop();
console.log(arr2);この例では、配列[“a”, “b”, “c”, “d”]の末尾の要素を削除するという内容になっていますね。
では結果を見てみると
こうですね。
配列から末尾の要素「d」が削除されていますね。
では次に配列の途中の要素を削除する方法について見ていきましょう。
配列の途中の要素を削除する方法
配列の途中の要素を削除するにはsplice()を用います。
splice()の書き方
配列.splice(開始位置, 削除する数)
splice()を用いた例
let arr3 = ["a", "b", "c", "d", "e"];
let arr4 = ["f", "g", "h", "i", "j"];
arr3.splice(3, 1);
arr4.splice(2, 2);
console.log(arr3);
console.log(arr4);この例では、配列[“a”, “b”, “c”, “d”, “e”]の３番目の要素を１つ削除し、配列[“f”, “g”, “h”, “i”, “j”]の２番目から２つの要素を削除するという内容になっています。
では結果を見てみると
こうですね。
最初の配列からは３番目の要素である「d」が、２番目の配列からは２番目以降の２つの要素「h」と「i」がそれぞれ削除されていますね。
では次に条件に合わない要素を配列から削除する方法について見ていきましょう。
条件に合わない要素を配列から削除する方法
条件に合わない要素を配列から削除するにはfilter()を用います。
filter()の書き方
配列.filter( 要素 => 要素を用いた条件);
filter()の返り値
条件に合う要素からなる配列
filter()を用いた例
let nums = [3, 5, 2, 1, 4];
nums = nums.filter( nums => nums >= 3 );
console.log(nums);この例では、filter()を用いて配列[3, 5, 2, 1, 4]のそれぞれの要素から３以上の数値を抽出し、
それらからなる配列を返すという内容になっていますね。
filter()の返り値は、条件に合う要素からなる新しい配列なので変数「nums」に代入して、
元の配列を更新してあげればいいですね。
では結果を見てみると
こうですね。
ちゃんと３以上の数値からなる配列になっていますね。
このようにすることで、結果的に２より小さい数値を配列から削除することができているわけですね。
まとめ
以上で見てきたように、shift()やpop()、splice()やfilter()を用いることで配列の要素を削除することができます。
今回は配列から要素を削除する方法についての説明でした。
配列に要素を追加する方法については以下のページで説明をしていますので、
ご覧いただきたいと思います。
JavaScriptで配列に新たな要素を追加する方法
コメント