JavaScript 配列に要素を追加する方法５選！

JavaScriptで配列に要素を追加する方法を知りたいときはないでしょうか。

けど、そんな中で悩むことは、

ですよね。

今回はそんなお悩みを解決する

についてまとめます！

JavaScriptの配列とは

JavaScriptの配列とはArrayオブジェクトで扱われ、複数のデータを一つの変数にまとめたものです。
目的のデータをインデックス（位置番号）や添え字の指定により呼び出すことができます。

また、JavaScript の配列はリサイズ可能であり、異なるデータ型を交ぜて格納することができます。

JavaScriptの配列の使い方

JavaScriptの配列の基本的な使い方については別の記事にまとめていますので、こちらをご参照ください。

JavaScriptの配列を追加する方法

JavaScriptの配列を追加する方法をいくつかご紹介します。

配列の要素を追加する方法①：インデックス値を指定し要素を追加する

配列の要素を追加する方法①はインデックス値を指定し要素を追加していきます。

//新しい Array オブジェクトを生成します。
let arrTemp = new Array(2);
arrTemp = [1,2];
console.log( arrTemp );
//配列の３番目に要素を追加します。
arrTemp[2] = 3;
console.log( arrTemp );

結果です。

配列の要素を追加する方法②：Pushメソッドで要素を追加する

配列の要素を追加する方法②はpush()メソッドで要素を追加していきます。

配列の末尾に 1 つ以上の要素を追加することができます。

//新しい Array オブジェクトを生成します。
let arrTemp = new Array(2);
arrTemp = [1,2];
console.log( arrTemp );
//配列の３番目に要素を追加します。
arrTemp.push(3);
console.log( arrTemp );

結果です。

配列の要素を追加する方法③：Unshiftメソッドで要素を追加する

配列の要素を追加する方法③はUnshiftメソッドで要素を追加していきます。

配列の先頭に 1 つ以上の要素を追加することができます。

//新しい Array オブジェクトを生成します。
let arrTemp = new Array(2);
arrTemp = [1,2];
console.log( arrTemp );
//配列の先頭に要素を追加します。
arrTemp.unshift(3);
console.log( arrTemp );

結果です。

配列の要素を追加する方法④：concat メソッドを使い要素を追加する

配列の要素を追加する方法④はconcat メソッドを使い要素を追加していきます。
concat メソッドは、指定した配列を元の配列に連結して新しい配列を作成します。

const array1 = [1, 2, 3];
const array2 = [4];
const newArray = array1.concat(array2);
console.log(newArray);

結果です。

配列の要素を追加する方法⑤：spread operatorを使い要素を追加する

配列の要素を追加する方法⑤はspread operatorを使い要素を追加していきます。
spread operator は、配列やオブジェクトを展開して、別の配列やオブジェクトに挿入するために使用できます。

const array1 = [1, 2, 3];
const array2 = [4];
const newArray = [...array1, ...array2];
console.log(newArray);

結果です。

さいごに

いかがでしょうか。

今回は、

についてまとめました。

また、他にも便利な方法がありますので、よろしければご参照頂ければと思います。