ES10 增加了 Array 的 flat() 和 flatMap()

在 ES10 中，Array 新增了两个方法：flat() 和 flatMap()。这些方法让我们更容易地操作多维数组，同时提高了数据处理的效率。接下来，本文将对这两个方法进行详细介绍，并提供一些使用示例。

flat()

Array 的 flat() 方法可以将多维数组 “压扁” 成一维数组。这个方法有一个可选参数 depth，指定需要 “压扁” 的层数。默认情况下，depth 的值为 1。

使用 flat() 的语法如下：

arr.flat([depth]);

下面是一些示例代码：

// 将二维数组压扁成一维数组
const arr1 = [[1, 2], [3, 4]];
const flatArr1 = arr1.flat(); // [1, 2, 3, 4]

// 将三维数组压扁成二维数组
const arr2 = [[[1, 2]], [[3, 4]]];
const flatArr2 = arr2.flat(2); // [[1, 2], [3, 4]]

在使用 flat() 方法时，需要注意，该方法会移除数组中的所有空位 undefined。

flatMap()

flatMap() 方法可以将多维数组 “压扁” 后，再执行 map() 方法。这个方法的语法如下：

arr.flatMap(callback[, thisArg]);

其中，callback 函数需要返回一个新的数组值，flatMap() 会将这些新值 “压扁” 并返回到一个新的数组中。

下面是一些使用示例：

const arr1 = [1, 2, 3];
const arr2 = arr1.flatMap(x => [x * 2]); // [2, 4, 6]

const arr3 = [[1], [2], [3]];
const arr4 = arr3.flatMap(x => x * 2); // [2, 4, 6]

需要注意的是，flatMap() 方法执行的顺序是先执行 map() 方法，再执行 flat() 方法。

总结

ES10 的 Array 增加了 flat() 和 flatMap() 方法，它们可以帮助我们更好地操作多维数组。在使用这些方法时，需要注意一些细节，比如 flat() 会移除数组中的所有空位 undefined，flatMap() 的执行顺序是 map() 和 flat()。总的来说，这些方法可以提高数据处理的效率，并使代码更加简洁易读。

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