在JavaScript开发中，处理多层嵌套的数组结构是常见需求，将多维数组转换为一维数组的操作被称为数组扁平化。递归是实现这一功能的典型方案，尤其适合嵌套层级不固定的场景，下面我们从基础逻辑到完整实现逐步解析。
递归实现的核心思路
递归的核心逻辑是重复执行相同的操作直到满足终止条件。对于数组扁平化来说，我们需要遍历数组的每一个元素，如果当前元素是数组，就继续对这个子数组执行扁平化操作，直到元素不再是数组类型，再将其加入结果数组。
基础版本实现
最基础的递归实现会定义一个结果数组，遍历原数组时判断元素类型，若是数组则递归调用自身，否则直接推入结果数组：
// 基础递归扁平化函数
function flattenArray(arr) {
let result = [];
for (let i = 0; i < arr.length; i++) {
// 判断当前元素是否为数组
if (Array.isArray(arr[i])) {
// 递归处理子数组，将结果合并到当前结果数组
result = result.concat(flattenArray(arr[i]));
} else {
// 非数组元素直接加入结果
result.push(arr[i]);
}
}
return result;
}
// 测试示例
const testArr = [1, [2, [3, 4], 5], 6, [7, 8]];
console.log(flattenArray(testArr)); // 输出 [1,2,3,4,5,6,7,8]
优化版本实现
基础版本每次递归都会创建新的结果数组，使用concat方法合并也会有额外开销，我们可以优化为传递结果数组的方式减少内存占用：
// 优化后的递归扁平化函数
function flattenArrayOptimized(arr, result = []) {
for (let item of arr) {
if (Array.isArray(item)) {
// 递归时将已有的结果数组传递下去
flattenArrayOptimized(item, result);
} else {
result.push(item);
}
}
return result;
}
// 测试示例
const testArr2 = [1, [2, [3, [4, 5]], 6], 7];
console.log(flattenArrayOptimized(testArr2)); // 输出 [1,2,3,4,5,6,7]
边界情况处理
实际使用中需要考虑一些特殊场景，比如数组中包含空位、非数组类型的嵌套对象等情况：
- 如果数组存在空位，遍历时需要注意空位会被跳过，不会影响最终结果
- 如果数组中包含其他可迭代对象，比如
Set、Map，基础的Array.isArray判断会失效，需要额外处理 - 如果数组嵌套层级过深，可能会出现递归栈溢出的情况，此时需要考虑用迭代方式替代递归
递归与内置方法的对比
JavaScript数组内置了flat方法可以实现扁平化，我们对比一下两者的差异：
| 实现方式 | 优势 | 不足 |
|---|---|---|
| 递归实现 | 兼容性好，可自定义处理逻辑，适合复杂嵌套场景 | 层级过深时可能栈溢出，代码量相对更多 |
| Array.prototype.flat | 语法简洁，原生支持，可指定扁平化深度 | 旧环境需要polyfill，自定义处理不够灵活 |
如果需要在不支持flat方法的环境中实现扁平化，或者需要处理特殊的嵌套逻辑，递归实现仍然是可靠的选择。理解递归的实现逻辑，也能帮助开发者更好地掌握数组操作的底层思路。
JavaScript递归多维数组扁平化修改时间：2026-07-03 12:00:10