JavaScript数组扁平化技巧大全

小伙伴们有没有觉得学习文章很有意思？有意思就对了！今天就给大家带来《JavaScript数组扁平化方法详解》，以下内容将会涉及到，若是在学习中对其中部分知识点有疑问，或许看了本文就能帮到你！

JavaScript数组扁平化是将多维数组转为一维数组的过程，常用方法包括：使用ES2019的flat()方法可指定层级或Infinity展开全部；递归遍历数组并合并元素实现自定义逻辑；结合reduce与concat进行函数式编程处理；利用扩展运算符与some循环展开直至无嵌套。推荐优先使用flat()，兼容性不足时选用其他方式，操作中应注意保持原数据不变，必要时深拷贝。

JavaScript数组扁平化是指将多维数组（嵌套数组）转换为一维数组的过程。这在处理后端返回的复杂数据结构或进行数据清洗时非常实用。实现方式有多种，可以根据具体需求选择合适的方法。

使用 flat() 方法（推荐）

flat() 是ES2019引入的原生方法，用于将数组递归展开指定的层级。

[1, [2, 3], [4, [5]]].flat(); // 结果：[1, 2, 3, 4, [5]]

[1, [2, 3], [4, [5]]].flat(2); // 结果：[1, 2, 3, 4, 5]

[1, [2, [3, [4]]]].flat(Infinity); // 结果：[1, 2, 3, 4]

递归实现手动扁平化

当需要兼容老环境或自定义逻辑时，可以手写递归函数。

function flatten(arr) {
  let result = [];
  for (let item of arr) {
    if (Array.isArray(item)) {
      result = result.concat(flatten(item));
    } else {
      result.push(item);
    }
  }
  return result;
}

flatten([1, [2, [3, [4]]]]); // [1, 2, 3, 4]

利用 reduce 和 concat 实现

通过数组的 reduce 方法结合 concat，也能实现扁平化。

const flat = arr => arr.reduce((acc, val) =>
  Array.isArray(val) ? acc.concat(flat(val)) : acc.concat(val), []);

使用扩展运算符与 some 配合循环处理

适用于不确定嵌套层数但想避免递归的情况。

while (arr.some(Array.isArray)) {
  arr = [].concat(...arr);
}

基本上就这些常见方式。flat() 最简洁，兼容性允许时优先使用；其他方法则更灵活，适合定制场景。数据转换过程中注意保持原始数据不变，必要时做深拷贝处理。

到这里，我们也就讲完了《JavaScript数组扁平化技巧大全》的内容了。个人认为，基础知识的学习和巩固，是为了更好的将其运用到项目中，欢迎关注golang学习网公众号，带你了解更多关于的知识点！