跳到主要内容

JavaScript 数组的 concat() 方法详解

concat() 方法通过合并两个或多个值/数组来返回一个新数组。

示例​

let primeNumbers = [2, 3, 5, 7];
let evenNumbers = [2, 4, 6, 8];

// 合并两个数组
let joinedArrays = primeNumbers.concat(evenNumbers);
console.log(joinedArrays);

/* 输出:
[
 2, 3, 5, 7,
 2, 4, 6, 8 
]
*/

concat() 语法​

concat() 方法的语法是：

arr.concat(value1, value2, ..., valueN)

这里，arr 是一个数组。

concat() 参数​

concat() 方法接受任意数量的数组和/或值作为参数。

concat() 返回值​

  • 返回合并了所有在参数中传入的数组/值后的新创建的数组。

concat() 方法首先创建一个包含了调用该方法对象元素的新数组。然后它依次添加参数或参数的元素（对于数组）。

示例 1：使用 concat() 方法​

var languages1 = ["JavaScript", "Python", "Java"];
var languages2 = ["C", "C++"];

// 合并两个数组
var new_arr = languages1.concat(languages2);
console.log(new_arr); // [ 'JavaScript', 'Python', 'Java', 'C', 'C++' ]

// 合并一个值和数组
var new_arr1 = languages2.concat("Lua", languages1);
console.log(new_arr1); // [ 'C', 'C++', 'Lua', 'JavaScript', 'Python', 'Java' ]

输出

["JavaScript", "Python", "Java", "C", "C++"][
  ("C", "C++", "Lua", "JavaScript", "Python", "Java")
];

示例 2：合并嵌套数组​

concat() 方法以以下方式返回连接元素的浅拷贝：

  • 它将对象引用复制到新数组中。（例如：传递嵌套数组）所以如果引用的对象被修改，更改在返回的新数组中也是可见的。
  • 它将字符串和数字的值复制到新数组中。
var randomList = [1, 2, 3];
var randomNestedList = [
  [4, 5],
  [6, 7],
];

var combined = randomList.concat(randomNestedList);
console.log(combined); // [ 1, 2, 3, [ 4, 5 ], [ 6, 7 ] ]

// 将 1 的值改为 0
randomList[0] = 0;
console.log(randomList); // [ 0, 2, 3 ]

// 更改不反映在连接数组中
console.log(combined); // [ 1, 2, 3, [ 4, 5 ], [ 6, 7 ] ]

// 修改嵌套列表（在第一个元素中添加 6）
randomNestedList[0].push(6);
console.log(randomNestedList); // [ [ 4, 5, 6 ], [ 6, 7 ] ]

// 更改在连接数组中反映
// 因为它是对象的引用
console.log(combined); // [ 1, 2, 3, [ 4, 5, 6 ], [ 6, 7 ] ]

输出

[1, 2, 3, [4, 5], [6, 7]][(0, 2, 3)][(1, 2, 3, [4, 5], [6, 7])][
  ([1, 2, 3], [6, 7])
][(1, 2, 3, [4, 5, 6], [6, 7])];

在这里，嵌套数组的引用被复制到连接数组中。因此，当我们修改任何引用时，更改在所有地方都会反映出来。

推荐阅读：

最后于 更新