如何在 JavaScript 中合并两个数组？

String.prototype.concat()

String.prototype.concat() 方法将一个或多个字符串与原字符串连接合并，形成一个新的字符串并返回。

const a = [1, 2, 3]
const b = [4, 5, 6]

const merged = [].concat(a, b) // [1, 2, 3, 4, 5, 6]
// 或
const alsoMerged = a.concat(b) // [1, 2, 3, 4, 5, 6]

这两种方法都会产生新的数组，而不会改变原数组。

扩展运算符

const a = [1, 2, 3]
const b = [4, 5, 6]

const merged = [...a, ...b] // [1, 2, 3, 4, 5, 6]

两者的比较

String.prototype.concat() 可以比展开运算符更好地处理非数组值，这可能是在合并不确定是否为数组的值时需要考虑的问题：

const a = [1, 2, 3]
const b = true
const c = 'Hello'

const mergeAb = [...a, ...b] // Error：b 不可迭代
const mergeAc = [...a, ...c] // [1, 2, 3, 'h', 'i'] 错误的结果
// 你应该改用 [...a, b] 和 [...a, c]

const concatAb = [].concat(a, b) // [1, 2, 3, true]
const concatAb = [].concat(a, c) // [1, 2, 3, 'Hello']

如上面所看到的，当传递不可迭代对象时，展开运算符要么抛出错误，要么不输出正确的结果。而 String.prototype.concat 则不会出现这样的问题。

该如何选择？

只要知道输入是数组，就使用展开运算符（...），因为它的性能更好，而且易于阅读和理解。

当您对一个或多个输入不确定且不想添加额外的检查时，请使用 String.prototype.concat()，因为它可以更优雅地处理这些情况。