【JavaScript】複数の配列を連結して一つにまとめる【concat】

こんにちは、Ryohei（@ityryohei）です！

本記事では、JavaScriptで複数の配列を連結して一つにまとめる方法をご紹介しています。

上記の疑問にお答えしています。

では、解説していきます。

配列の連結にはconcat()メソッドを使おう！

concat()メソッドは配列に他の配列や値をつなげて新しい配列を返すArrayオブジェクトのメソッドです。使い方は簡単で、下記のように直感的に使用することができます。

const newArray = array1.concat(array2);

配列の定義は省いていますが、上記では「array1」と「array2」を連結して新しい配列を作っています。

もし3つ以上の配列を連結したい場合は、引数に配列を追加するだけで済みます。

const newArray = array1.concat(array2, array3);

concat()メソッドの使い方がわかったところで、実際に複数の配列を連結して一つにまとめてみましょう！

複数の配列を連結して一つにまとめる

では実際にconcat()メソッドを使用して複数の配列を連結して一つにまとめてみます。使用する配列にはアルファベットを4文字区切りで入れておきます。

JavaScript

const array1 = ['a', 'b', 'c', 'd'];
const array2 = ['e', 'f', 'g', 'h'];
const array3 = ['i', 'j', 'k', 'l'];

const newArray = array1.concat(array2, array3);

console.log(newArray);

今回は3つの配列を連結して一つにまとめてみます。実行結果は下記の通りです。

実行結果

["a", "b", "c", "d", "e", "f", "g", "h", "i", "j", "k", "l"]

結果を確認すると、「array1」、「array2」、「array3」の3つの配列が連結して新しい配列にまとまりましたね。思っていた通りの結果です。

最後に

本記事では配列を連結して一つにまとめるためにconcat()メソッドを使用しましたが、「配列 + 配列」はもちろん「配列 + 値」のような使い方もできる便利なメソッドですので、覚えておくと多くの場面で役に立つかと思います。

以上、JavaScriptで複数の配列を連結して一つにまとめる方法のご紹介でした！