JavaScript 数组 concat：合并数组

摘要：在本教程中，您将学习如何使用 JavaScript 数组 concat() 方法将两个或多个数组合并成一个数组。

要合并两个或多个数组，您可以使用 数组 对象的 concat() 方法。concat() 方法返回一个新数组，不会改变原始数组。例如

let odds = [1,3,5];
let evens = [2,4,6];
// merge odds and evens array
let combined = odds.concat(evens);

console.log('Result:', combined);
console.log('Odds:', odds);Code language: JavaScript (javascript)

输出

Result: [ 1, 3, 5, 2, 4, 6 ]
Odds: [ 1, 3, 5 ]Code language: CSS (css)

在本例中，我们有两个数组：odds 和 evens。我们调用 odds 数组方法的 concat() 方法来合并两个数组的元素。第二个数组的元素被追加到第一个数组的元素后面。

类似地，您可以对用 ([]) 表示的空数组调用 concat() 方法

let odds = [1,3,5];
let evens = [2,4,6];
// merge odds and evens array
let combined = [].concat(odds, evens);

console.log(combined);Code language: JavaScript (javascript)

输出

[ 1, 3, 5, 2, 4, 6 ]Code language: JSON / JSON with Comments (json)

concat() 方法允许您合并两个以上的数组，如以下示例所示

let upper  = ['A','B','C'];
let lower  = ['a','b','c'];
let digits = [1,2,3];
let alphanumerics = upper.concat(lower, digits);Code language: JavaScript (javascript)

输出

['A', 'B', 'C', 'a',  'b', 'c', 1,   2,  3]Code language: JSON / JSON with Comments (json)

在本例中，我们合并了三个数组：upper、lower 和 digits。

当您没有将任何参数传递给 concat() 方法时，它只是克隆数组并返回它

let colors = ['red','green','blue'];
let rgb = colors.concat();
console.log(rgb);Code language: JavaScript (javascript)

输出

[ 'red', 'green', 'blue' ]Code language: JSON / JSON with Comments (json)

如果您将不是数组的值传递给 concat() 方法，该方法会将每个值追加到结果数组的末尾

let rgb = ['red','green','blue'];
let moreColors = rgb.concat('yellow','magento');
console.log(moreColors);Code language: JavaScript (javascript)

输出

[ 'red', 'green', 'blue', 'yellow', 'magento' ]Code language: JSON / JSON with Comments (json)

在 ES6 中，您可以使用 扩展运算符 来合并多个数组，如下所示

let odds = [1,3,5];
let evens = [2,4,6];
let combined = [...odds, ...evens];
console.log(combined);Code language: JavaScript (javascript)

输出

[ 1, 3, 5, 2, 4, 6 ]Code language: JSON / JSON with Comments (json)

在本教程中，您学习了两种将多个数组合并成一个数组的方法，使用 JavaScript 数组 concat() 方法和扩展运算符。