Array.flat()与展开运算符实现多数组扁平化的性能及优劣对比问询

结论：在子数组长度未超过JS引擎函数参数上限的常规场景下，第一种使用展开运算符的实现执行效率更高、综合表现更优

两种实现的性能差异分析 #

• 第一种实现（展开运算符写法）：

let arr = [];
for (const array of arrays) {
  arr.push(...array);
}

执行逻辑为循环遍历每个子数组，直接通过展开运算符将当前子数组的元素解包后追加到结果数组中。全程仅需要一轮对所有元素的遍历，push是JS引擎高度优化的原生操作，没有额外的中间数组存储开销，也不存在多余的类型判断逻辑，性能损耗极低。

• 第二种实现（flat()写法）：

let arr = [];
for (const array of arrays) {
  arr.push(array);
}
arr = arr.flat();

存在两部分额外的性能开销：首先循环阶段会生成一个完整的二维中间数组，占用额外内存空间；其次调用flat()方法时，需要额外遍历一次整个中间数组，还要对每一个元素做「是否为数组」的类型判断后再执行展开操作，额外的遍历和判断逻辑会显著拉低执行效率。

特殊场景例外说明 #

第一种实现存在限制：JS引擎对函数的最大参数长度有明确规定，以常见的V8引擎为例，参数上限为65536。如果单个子数组的长度超过该上限，arr.push(...array)会抛出参数数量超限的错误。如果业务场景存在超长单个数组的情况，第二种实现的稳定性更高，不会触发参数超限报错。

内容的提问来源于stack exchange，提问作者Maor agai