JavaScript　配列の要素の追加・削除の方法

JavaScriptで配列の要素を追加・削除する方法を解説し、よく利用される配列操作のメソッドを紹介します。

配列の要素を追加・削除するにはどうしたらいいですか？

配列の要素を追加するにはpushメソッドやunshiftメソッドを、削除するにはpopメソッドやshiftメソッドを利用します。

配列の要素を追加する

　配列の要素を追加するには、配列の末尾に要素を追加するためのpushメソッドや、配列の先頭に要素を追加するためのunshiftメソッドを使用します。

・push()メソッド: 配列の末尾に要素を追加するメソッドです。

let fruits = ["apple", "banana"];
fruits.push("orange");
console.log(fruits); // ["apple", "banana", "orange"]

・unshift()メソッド: 配列の先頭に要素を追加するメソッドです。

let fruits = ["banana", "orange"];
fruits.unshift("apple");
console.log(fruits); // ["apple", "banana", "orange"]

　配列の要素を削除するには、配列の末尾から要素を削除するためのpop()メソッドや、配列の先頭から要素を削除するためのshiftメソッドを使用します。

・pop()メソッド: 配列の末尾から要素を削除するメソッドです。

let fruits = ["apple", "banana", "orange"];
fruits.pop();
console.log(fruits); // ["apple", "banana"]

・shift()メソッド: 配列の先頭から要素を削除するメソッドです。

let fruits = ["apple", "banana", "orange"];
fruits.shift();
console.log(fruits); // ["banana", "orange"]

以下の表には、JavaScriptの配列操作においてよく使用されるメソッドの使用例を示しています。

メソッド名	説明	使用例
splice()	配列の中から特定の要素を削除したり、新しい要素を挿入したりする	`let fruits = ["apple", "banana", "orange"]; fruits.splice(1,1,"lemon"); console.log(fruits); // ["apple","lemon","orange"]`
slice()	配列の一部を切り取って新しい配列を作成	`let fruits = ["apple", "banana", "orange"]; let newFruits = fruits.slice(1,2); console.log(newFruits); // ["banana"]`
forEach()	配列の要素を一つずつ取り出して、特定の処理を実行	`let fruits = ["apple", "banana", "orange"]; fruits.forEach(function(item,index) { console.log(index + ':' + item); });`
map()	配列の要素を一つずつ取り出して、新しい配列を作成	`let numbers = [1,2,3,4,5]; let doubleNumbers = numbers.map(function(num){ return num*2; }); console.log(doubleNumbers); // [2,4,6,8,10]`
filter()	配列の要素を一つずつ取り出して、条件に合うものだけを抽出して新しい配列を作成	`let numbers = [1,2,3,4,5]; let evenNumbers = numbers.filter(function(num){ return num%2==0; }); console.log(evenNumbers); // [2,4]`