【JavaScript】配列に要素を追加する方法

JavaScriptでは、配列に要素を追加する方法がいくつかあります。それぞれの方法には特徴があり、目的に応じて使い分けることができます。この記事では、主要な配列操作の方法を紹介します。

push() メソッドを使った要素の追加

push() メソッドは、配列の末尾に1つ以上の要素を追加するのに使います。このメソッドは、変更後の配列の長さを返します。

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

この方法は、配列の最後に要素を追加したいときに便利です。

unshift() メソッドは、配列の先頭に1つ以上の要素を追加するために使用します。追加された要素が先頭に挿入されるため、配列の順序が変更されます。

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

配列の最初に新しい要素を追加したいときに使用します。

スプレッド構文（…）を使用すると、配列の中に他の配列や要素を展開して追加することができます。新しい配列を作成する際に便利です。

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

複数の配列を結合する際にも有用です。

concat() メソッドを使用すると、元の配列を変更せずに、新しい配列を作成して要素を追加できます。このメソッドは、追加する要素を含む新しい配列を返します。

let fruits = ['apple', 'banana'];
let newFruits = fruits.concat('orange');
console.log(newFruits); // ['apple', 'banana', 'orange']

元の配列を変更せずに新しい配列を作成したいときに使用します。

splice() メソッドを使うと、指定した位置に要素を追加することができます。第一引数は開始位置、第二引数は削除する要素の数、以降の引数は追加する要素です。

let fruits = ['apple', 'banana'];
fruits.splice(1, 0, 'orange'); // 1番目の位置に 'orange' を追加
console.log(fruits); // ['apple', 'orange', 'banana']

配列の特定の位置に要素を挿入する際に便利です。

JavaScriptには、配列に要素を追加するためのさまざまな方法があります。使用するメソッドや構文を理解し、状況に応じて適切な方法を選択することで、効率的に配列操作を行うことができます。各メソッドの特徴を活かして、目的に応じた配列操作を行ってみてください。