本文详细介绍 JavaScript 中合并多个数组的七种常见方法，包括 Array.prototype.concat()、扩展运算符 (...)、Array.prototype.push.apply()、Array.prototype.reduce()、Array.prototype.forEach()，以及使用 lodash 和 Ramda 第三方库的 concat()。每种方法均提供代码示例与适用场景分析，帮助开发者根据实际需求选择最优方案。
JavaScript 数组合并概述
在 JavaScript 开发中，将多个数组合并为一个数组是常见的需求。
原生方法：concat、扩展运算符与 apply
第一种方法是利用 Array.prototype.concat()。该方法会返回一个新数组，包含调用它的数组以及作为参数传入的所有数组的元素。
let arr1 = [1, 2, 3];
let arr2 = [4, 5, 6];
let arr3 = [7, 8, 9];
let mergedArr = arr1.concat(arr2, arr3);
console.log(mergedArr); // [1, 2, 3, 4, 5, 6, 7, 8, 9]第二种方法是使用扩展运算符 (...)。这是 ES6 引入的特性，可以将数组展开并合并到新的数组字面量中，语法简洁直观。
let arr1 = [1, 2, 3];
let arr2 = [4, 5, 6];
let arr3 = [7, 8, 9];
let mergedArr = [...arr1, ...arr2, ...arr3];
console.log(mergedArr); // [1, 2, 3, 4, 5, 6, 7, 8, 9]第三种方法是结合使用 Array.prototype.push() 和 Function.prototype.apply()。通过 apply 将原数组作为参数列表传递给 push，从而将原数组元素逐个添加到目标数组中。注意，这种方法会修改原数组，若需保留原数组，应先复制。
let arr1 = [1, 2, 3];
let arr2 = [4, 5, 6];
let arr3 = [7, 8, 9];
let mergedArr = [].concat.apply([], [arr1, arr2, arr3]);
console.log(mergedArr); // [1, 2, 3, 4, 5, 6, 7, 8, 9]遍历与函数式方法：reduce 与 forEach
第四种方法是使用 Array.prototype.reduce()。通过 reduce 函数遍历数组集合，利用 concat 将每个子数组的元素累积到一个初始为空数组的累加器中，从而构建出合并后的新数组。
let arr1 = [1, 2, 3];
let arr2 = [4, 5, 6];
let arr3 = [7, 8, 9];
let mergedArr = [arr1, arr2, arr3].reduce((acc, cur) => acc.concat(cur), []);
console.log(mergedArr); // [1, 2, 3, 4, 5, 6, 7, 8, 9]第五种方法是使用 Array.prototype.forEach()。通过双重循环遍历所有子数组及其元素，并将每个元素 push 到目标数组中。这种方式逻辑直观，但代码相对冗长。
let arr1 = [1, 2, 3];
let arr2 = [4, 5, 6];
let arr3 = [7, 8, 9];
let mergedArr = [];
[arr1, arr2, arr3].forEach(function(array) {
array.forEach(function(element) {
mergedArr.push(element);
});
});
console.log(mergedArr); // [1, 2, 3, 4, 5, 6, 7, 8, 9]第三方库方案：lodash 与 Ramda
第六种方法是借助第三方库 lodash。lodash 提供了 concat() 函数，其用法与原生 concat 类似，但在处理某些边缘情况或提供更丰富的工具函数方面具有优势。
第七种方法是使用第三方库 Ramda。Ramda 的 concat() 函数遵循函数式编程原则，支持柯里化，适合在函数式编程风格的项目中使用。
综上所述，JavaScript 提供了多种数组合并方案。开发者可根据项目环境、性能要求及代码风格偏好，选择最适合的方法。
本文介绍了 JS 中数组合并的几种常见方法。如需了解更多相关内容，建议查阅本站过往文章或继续浏览后续教程。