concat() メソッドは、配列に他の配列や値をつないでできた新しい配列を返します。

構文

var new_array = old_array.concat([value1[, value2[, ...[, valueN]]]])

引数

valueN Optional
新しい配列に連結する配列や値です。 valueN
undefined の場合、 concat は呼び出された既存の配列のシャローコピーを返します。詳しくは下記の解説をお読みください。

返値

新しい Array インスタンス。

解説

concat は、メソッドを呼び出した this オブジェクトの要素に、与えられた引数の要素 (引数が配列である場合) または引数そのもの (引数が配列でない場合) が順に続く、新しい配列オブジェクトを生成します。

concatthis や引数として与えられた配列を変更しませんが、その代わりに元の配列から結合させた同じ要素のコピーを含むシャローコピー (1 次元の配列要素までの浅いコピー) を返します。元の配列の要素は以下のようにして新しい配列にコピーされます。

  • オブジェクトの参照 (実際のオブジェクトではなく): concat はオブジェクトの参照を新しい配列にコピーします。元の配列も新しい配列も同じオブジェクトを参照します。これはつまり、もし参照されているオブジェクトが修正されれば、その変更は元の配列と新しい配列の両方に現れるわけです。
  • 文字列や数値、真偽値 (String オブジェクトや Number オブジェクト、Boolean オブジェクトではなく): concat は文字列や数値の値を新しい配列にコピーします。

メモ: 連結した配列/値は元の配列には手を付けません。さらに、新しい配列へどんな操作をしても、元の配列には影響しません。逆もまた同様です(要素がオブジェクト参照ではない場合のみです)。

2 つの配列を連結させる

以下のコードは 2 つの配列を連結させます。

var alpha = ['a', 'b', 'c'];
var numeric = [1, 2, 3];

alpha.concat(numeric);
// result in ['a', 'b', 'c', 1, 2, 3]

3 つの配列を連結させる

以下のコードは 3 つの配列を連結させます。

var num1 = [1, 2, 3],
    num2 = [4, 5, 6],
    num3 = [7, 8, 9];

var nums = num1.concat(num2, num3);

console.log(nums);
// results in [1, 2, 3, 4, 5, 6, 7, 8, 9]

配列に値を連結させる

以下のコードは配列に値を連結させます。

var alpha = ['a', 'b', 'c'];

var alphaNumeric = alpha.concat(1, [2, 3]);

console.log(alphaNumeric); 
// results in ['a', 'b', 'c', 1, 2, 3]

ネストした配列を連結する

以下のコードはネストした配列同士を連結させます。また、元の配列からの参照を保持しています。

var num1 = [[1]];
var num2 = [2, [3]];

var nums = num1.concat(num2);

console.log(nums);
// results in [[1], 2, [3]]

// num1 の最初の要素を変更します
num1[0].push(4);

console.log(nums);
// results in [[1, 4], 2, [3]]

仕様書

仕様書 状態 備考
ECMAScript 3rd Edition (ECMA-262) 標準 初回定義。JavaScript 1.2 で実装。
ECMAScript 5.1 (ECMA-262)
Array.prototype.concat の定義
標準  
ECMAScript 2015 (6th Edition, ECMA-262)
Array.prototype.concat の定義
標準  
ECMAScript Latest Draft (ECMA-262)
Array.prototype.concat の定義
ドラフト  

ブラウザーの対応

Update compatibility data on GitHub
デスクトップモバイルサーバー
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewAndroid 版 ChromeEdge MobileAndroid 版 FirefoxAndroid 版 OperaiOS 版 SafariSamsung InternetNode.js
基本対応Chrome 完全対応 1Edge 完全対応 ありFirefox 完全対応 1IE 完全対応 5.5Opera 完全対応 ありSafari 完全対応 ありWebView Android 完全対応 ありChrome Android 完全対応 ありEdge Mobile 完全対応 ありFirefox Android 完全対応 4Opera Android 完全対応 ありSafari iOS 完全対応 ありSamsung Internet Android 完全対応 ありnodejs 完全対応 あり

凡例

完全対応  
完全対応

関連情報

ドキュメントのタグと貢献者

最終更新者: mfuji09,