---
title: Array.prototype.concat()
slug: Web/JavaScript/Reference/Global_Objects/Array/concat
tags:
  - JavaScript
  - 原型
  - 数组
  - 方法
translation_of: Web/JavaScript/Reference/Global_Objects/Array/concat
---
<div>{{JSRef}}</div>

<p> <code><strong>concat()</strong></code> 方法用于合并两个或多个数组。此方法不会更改现有数组，而是返回一个新数组。</p>

<p>{{EmbedInteractiveExample("pages/js/array-concat.html")}}</p>

<h2 id="语法">语法</h2>

<pre class="syntaxbox notranslate">var <var>new_array</var> = <var>old_array</var>.concat(<var>value1</var>[, <var>value2</var>[, ...[, <var>valueN</var>]]])</pre>

<h3 id="Parameters" name="Parameters">参数</h3>

<dl>
 <dt><code>value<em>N</em></code>{{optional_inline}}</dt>
 <dd>数组和/或值，将被合并到一个新的数组中。如果省略了所有 <code>valueN</code> 参数，则 <code>concat</code> 会返回调用此方法的现存数组的一个浅拷贝。详情请参阅下文描述。</dd>
</dl>

<h3 id="返回值">返回值</h3>

<p>新的 {{jsxref("Array")}} 实例。</p>

<h2 id="Description" name="Description">描述</h2>

<p><code>concat</code>方法创建一个新的数组，它由被调用的对象中的元素组成，每个参数的顺序依次是该参数的元素（如果参数是数组）或参数本身（如果参数不是数组）。它不会递归到嵌套数组参数中。</p>

<p><code>concat</code>方法不会改变<code>this</code>或任何作为参数提供的数组，而是返回一个浅拷贝，它包含与原始数组相结合的相同元素的副本。 原始数组的元素将复制到新数组中，如下所示：</p>

<ul>
 <li>对象引用（而不是实际对象）：<code>concat</code>将对象引用复制到新数组中。 原始数组和新数组都引用相同的对象。 也就是说，如果引用的对象被修改，则更改对于新数组和原始数组都是可见的。 这包括也是数组的数组参数的元素。</li>
</ul>

<ul>
 <li>数据类型如字符串，数字和布尔（不是{{jsxref("Global_Objects/String", "String")}}，{{jsxref("Global_Objects/Number", "Number")}} 和 {{jsxref("Global_Objects/Boolean", "Boolean")}} 对象）：<code>concat</code>将字符串和数字的值复制到新数组中。</li>
</ul>

<div class="note">
<p><strong>注意：</strong>数组/值在连接时保持不变。此外，对于新数组的任何操作（仅当元素不是对象引用时）都不会对原始数组产生影响，反之亦然。</p>
</div>

<h2 id="Examples" name="Examples">示例</h2>

<h3 id="Example_Concatenating_two_arrays" name="Example:_Concatenating_two_arrays">连接两个数组</h3>

<p>以下代码将两个数组合并为一个新数组：</p>

<pre class="brush: js notranslate">var alpha = ['a', 'b', 'c'];
var numeric = [1, 2, 3];

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

<h3 id="Example_Concatenating_three_arrays" name="Example:_Concatenating_three_arrays">连接三个数组</h3>

<p>以下代码将三个数组合并为一个新数组：</p>

<pre class="brush: js notranslate">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]</pre>

<h3 id="Example_Concatenating_values_to_an_array" name="Example:_Concatenating_values_to_an_array">将值连接到数组</h3>

<p>以下代码将三个值连接到数组：</p>

<pre class="brush: js notranslate">var alpha = ['a', 'b', 'c'];

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

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

<h3 id="合并嵌套数组">合并嵌套数组</h3>

<p>以下代码合并数组并保留引用：</p>

<pre class="brush: js notranslate">var num1 = [[1]];
var num2 = [2, [3]];
var num3=[5,[6]];

var nums = num1.concat(num2);

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

var nums2=num1.concat(4,num3);

console.log(nums2)
// results is [[1], 4, 5,[6]]

// modify the first element of num1
num1[0].push(4);

console.log(nums);
// results is [[1, 4], 2, [3]]</pre>

<h2 id="规范">规范</h2>

<table class="standard-table">
 <tbody>
  <tr>
   <th scope="col">Specification</th>
   <th scope="col">Status</th>
   <th scope="col">Comment</th>
  </tr>
  <tr>
   <td>{{SpecName('ES3')}}</td>
   <td>{{Spec2('ES3')}}</td>
   <td>Initial definition. Implemented in JavaScript 1.2.</td>
  </tr>
  <tr>
   <td>{{SpecName('ES5.1', '#sec-15.4.4.4', 'Array.prototype.concat')}}</td>
   <td>{{Spec2('ES5.1')}}</td>
   <td></td>
  </tr>
  <tr>
   <td>{{SpecName('ES6', '#sec-array.prototype.concat', 'Array.prototype.concat')}}</td>
   <td>{{Spec2('ES6')}}</td>
   <td></td>
  </tr>
  <tr>
   <td>{{SpecName('ESDraft', '#sec-array.prototype.concat', 'Array.prototype.concat')}}</td>
   <td>{{Spec2('ESDraft')}}</td>
   <td></td>
  </tr>
 </tbody>
</table>

<h2 id="浏览器兼容">浏览器兼容</h2>

<p>{{Compat("javascript.builtins.Array.concat")}}</p>

<h2 id="相关链接">相关链接</h2>

<ul>
 <li>{{jsxref("Array.push", "push")}} / {{jsxref("Array.pop", "pop")}} — add/remove elements from the end of the array</li>
 <li>{{jsxref("Array.unshift", "unshift")}} / {{jsxref("Array.shift", "shift")}} — add/remove elements from the beginning of the array</li>
 <li>{{jsxref("Array.splice", "splice")}} — add/remove elements from the specified location of the array</li>
 <li>{{jsxref("String.prototype.concat()")}}</li>
 <li>{{jsxref("Symbol.isConcatSpreadable")}} – control flattening.</li>
</ul>