ES9 的 Array.prototype.flat 和 Array.prototype.flatMap：如何高效处理嵌套数组

在 JavaScript 中，数组是一种非常常见的数据结构，但是在实际开发中，我们经常会遇到嵌套数组的情况。在处理嵌套数组时，我们需要使用一些方法来展开或者压平这些数组。在 ES9 中，新增了两个方法：Array.prototype.flat 和 Array.prototype.flatMap，它们可以帮助我们高效地处理嵌套数组。

Array.prototype.flat

Array.prototype.flat 方法可以将嵌套数组展开成一维数组。该方法接收一个可选参数，用于指定展开的深度。如果不传递参数，则默认展开一层。

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

在上面的例子中，数组 arr 中包含了三层嵌套的子数组。通过调用 arr.flat() 方法，我们可以将其展开成一维数组。如果传递参数 1，则只展开一层，如果传递参数 2，则展开两层。

需要注意的是，Array.prototype.flat 方法会移除数组中的空项。

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

在上面的例子中，数组 arr 中包含了一个空项。通过调用 arr.flat() 方法，我们可以将其移除。

Array.prototype.flatMap

Array.prototype.flatMap 方法可以将嵌套数组压平成一维数组，并且可以对每个元素执行一个映射函数。该方法的返回值是一个新的数组。

const arr = [1, 2, 3];
console.log(arr.flatMap(item => [item * 2])); // [2, 4, 6]

在上面的例子中，我们定义了一个数组 arr，其中包含了三个元素。通过调用 arr.flatMap() 方法，并传递一个映射函数，我们可以将数组压平成一维数组，并且将每个元素乘以 2。

需要注意的是，Array.prototype.flatMap 方法会移除数组中的空项。

const arr = [1, 2, , 3, 4];
console.log(arr.flatMap(item => [item * 2])); // [2, 4, 6, 8]

在上面的例子中，数组 arr 中包含了一个空项。通过调用 arr.flatMap() 方法，我们可以将其移除，并且将每个元素乘以 2。

总结

在本文中，我们介绍了 ES9 中新增的 Array.prototype.flat 和 Array.prototype.flatMap 方法，它们可以帮助我们高效地处理嵌套数组。Array.prototype.flat 方法可以将嵌套数组展开成一维数组，而 Array.prototype.flatMap 方法可以将嵌套数组压平成一维数组，并且可以对每个元素执行一个映射函数。需要注意的是，这两个方法会移除数组中的空项。在实际开发中，我们可以根据具体的需求选择使用哪个方法。

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