最常用、最推荐的方式是扩展运算符(...)或concat():扩展运算符语法简洁、支持混入单值且现代项目首选,但超65536元素易栈溢出;concat兼容性好、可一次合并多数组且对null/undefined更宽容,均不修改原数组。

JavaScript 中合并多个不同数组最常用、最推荐的方式是使用扩展运算符(...)或 Array.concat() 方法,两者都能简洁安全地完成任务,但扩展运算符更现代、更灵活。
用扩展运算符一次性合并多个数组
这是目前最主流、可读性最好的方式,支持任意数量的数组,还能混入单独元素:
-
语法简单直观:
const merged = [...arr1, ...arr2, ...arr3]; - 不会修改原数组,返回一个全新数组
- 支持嵌套展开,比如
[...arr1, 'a', ...arr2, 42] - 注意:如果某个数组是
null或undefined,会报错,建议先做有效性判断
用 concat() 方法兼容老环境
适用于需要支持 IE 等旧浏览器的项目,语法稍显冗长但非常稳定:
-
基础用法:
const merged = arr1.concat(arr2, arr3, arr4); - 也支持传入单个值,如
arr1.concat([1, 2], 3, [4, 5])→[..., 1, 2, 3, 4, 5] - 同样不修改原数组,返回新数组
- 对
null或undefined参数较宽容(会忽略或转为字符串,行为需留意)
动态合并不确定数量的数组(如参数列表)
当数组来源是函数参数、变量集合等不确定长度时,推荐结合扩展运算符与解构或 Array.from():
- 函数接收多个数组参数:
function merge(...arrays) { return arrays.flat(); } - 或者更稳妥地过滤空值:
arrays.filter(Array.isArray).flat() - 若数据在类数组对象中(如
arguments),可用Array.from(arguments).flat()
注意深合并(嵌套对象/数组)不是默认行为
上述所有方法都只做浅合并 —— 即只合并第一层元素。如果数组里包含对象,它们仍是同一引用:
- 例如:
const a = [{x: 1}]; const b = [{y: 2}]; const c = [...a, ...b]; - 修改
c[0].x会影响a[0].x,因为对象未被复制 - 需要深合并时,得借助
JSON.parse(JSON.stringify())(简单场景)、structuredClone()(现代浏览器),或 Lodash 的cloneDeep
Java免费学习笔记:立即使用
解锁 Java 大师之旅:从入门到精通的终极指南











