JavaScriptで配列のマージ方法をサンプルコード付き解説!

JavaScriptで配列のマージ方法をサンプルコード付き解説します。JavaScriptで配列をマージしたいというときはよくあると思います。ここではその方法を3つそれぞれ項目を分けて解説します。

コンテンツ [表示]

  1. 1JavaScriptで配列をマージしたい
  2. 2JavaScriptで配列をマージする方法
  3. 2.1Object.assignを使った方法
  4. 2.2pushを使った方法
  5. 2.3concatを使った方法
  6. 3まとめ

JavaScriptで配列をマージしたい

JavaScriptで2つの配列をマージして1つにしたいというケースを考えます。

JavaScriptでは配列のマージ方法はいくつかありますが、ここではその方法を3つ、それぞれ項目を分けてサンプルコード付きで解説します。

Photo byPexels

JavaScriptで配列をマージする方法

それではJavaScriptで配列を結合する方法を3つそれぞれ項目を分けて解説します。

Object.assignを使った方法

Object.assignを使うと配列を結合することができるのですが、1つ注意点があります。

それはキー番号が重複する部分は第二引数の配列の値で上書きされてしまうということです。

実際にサンプルコードで挙動を確認してみましょう。

このように2つの配列が結合はされているが、連結されずキー番号が重複する部分は第二引数の配列の値で上書きされてしまっていることが分かります。

pushを使った方法

pushメソッドを用いると配列を結合することができます。

ただしうまく結合させるためには、結合する側の配列をforEachメソッドで展開させる必要があります。

このように連結させる側の配列をforEachメソッドで展開することで、pushメソッドを用いてうまく結合させることができます。

concatを使った方法

こちらのconcatを使った方法が一番簡単なのでオススメです。

このように新しい変数にconcatメソッドを用いて、配列を連結したものを格納することで使うことができます。

まとめ

いかがでしたでしょうか?

配列を結合する方法はここで紹介した3つの方法が主になります。

個人的に一番簡単に配列を結合することができるconcatメソッドを用いた方法をオススメします。

ぜひここで紹介した方法を用いて試してみてください。

GeekHive採用サイト

関連記事