ES10 中新增的 Array.prototype.flat 与 reduce 实现数组扁平化

介绍

在 JavaScript 中，我们经常需要处理嵌套的数组，而这些嵌套的数组可能会包含多层嵌套，这时候就需要将其扁平化，以便更方便地进行处理。在 ES10 中，新增了 Array.prototype.flat 方法来实现数组扁平化，同时我们也可以使用 reduce 方法来实现。

Array.prototype.flat

Array.prototype.flat 方法可以将嵌套的数组扁平化为一个数组，该方法可以接受一个参数，用于指定扁平化的层数，如果不传递参数，则默认扁平化一层。

示例代码：

const arr = [1, 2, [3, 4, [5, 6]]];
const flatArr = arr.flat(2);
console.log(flatArr); // [1, 2, 3, 4, 5, 6]

在上面的代码中，我们将 arr 数组扁平化了两层，最终得到了一个扁平化后的数组 flatArr。

需要注意的是，如果我们不知道数组的嵌套层数，可以使用 Infinity 来指定扁平化所有层级。

reduce 方法实现数组扁平化

除了使用 Array.prototype.flat 方法，我们还可以使用 reduce 方法来实现数组扁平化。

示例代码：

const arr = [1, 2, [3, 4, [5, 6]]];
const flatArr = arr.reduce((prev, cur) => {
  return prev.concat(Array.isArray(cur) ? flat(cur) : cur);
}, []);
console.log(flatArr); // [1, 2, 3, 4, 5, 6]

在上面的代码中，我们使用 reduce 方法来遍历数组，如果当前元素是一个数组，则递归调用 flat 函数，否则直接将当前元素添加到结果数组中。

总结

Array.prototype.flat 方法和 reduce 方法都可以用来实现数组扁平化，使用哪种方法取决于个人偏好和实际需求。在使用 Array.prototype.flat 方法时，需要注意指定扁平化的层数，如果不知道层数可以使用 Infinity 来指定。在使用 reduce 方法时，需要注意递归调用 flat 函数来处理嵌套的数组。

无论使用哪种方法，都可以轻松实现数组扁平化，提高代码的可读性和可维护性。

来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/65bee339add4f0e0ff8694cb