ES10 新增方法初探之 Array.prototype.flat()-JavaScript中文网-JavaScript教程资源分享门户

在 ES10 中，Array.prototype 上添加了一个新的方法：Array.prototype.flat()。本文将对这个新增方法进行详细的讲解，包括如何使用它以及它的指导意义。

什么是 flat() 方法

Array.prototype.flat() 方法用于将嵌套的数组“展平”，即将多维数组变为一维数组。它接收一个可选参数 depth，用于指定展平的层数。默认情况下，depth 为 1，即只展开一层。如果想要展开多层，可以将 depth 设置为一个大于等于 0 的整数。

下面是一个展示如何使用 flat() 方法的示例：

const arr = [1, 2, [3, 4], [5, 6, [7, 8]]];
const flattenedArr = arr.flat();

console.log(flattenedArr); // [1, 2, 3, 4, 5, 6, [7, 8]]

上面的代码中，原始数组 arr 包含四个元素，其中两个是数组。将 arr 应用 flat() 方法后，数组被展开为一个新的一维数组 flattenedArr。注意，最后一个元素 [7, 8] 并没有被展平，因为默认情况下 flat() 方法只展开一层。

如果想展开多层，可以像下面这样使用：

const arr = [1, 2, [3, 4], [5, 6, [7, 8]]];
const deeplyFlattenedArr = arr.flat(2);

console.log(deeplyFlattenedArr); // [1, 2, 3, 4, 5, 6, 7, 8]

上面的代码中，将 depth 参数设置为 2，即将嵌套数组展平两层。

使用 flat() 方法可以简化代码，并将多维数组转化为一维数组。例如，在处理树形结构的数据时，可以使用 flat() 方法将多层嵌套的数据变为一维数组，方便进行处理。

此外，flat() 方法也可以用于对数组进行去重等操作。例如，在下面的示例中：

const arr = [1, 2, [3, 4], [2, 5, [3, 6]]];

const uniqueArr = Array.from(new Set(arr.flat()));

console.log(uniqueArr); // [1, 2, 3, 4, 5, 6]

使用 flat() 方法可以将嵌套数组 flatten，再将结果转化为 Set，并将其转化为数组。这样可以快速进行去重操作。

在本文中，我们介绍了 ES10 新增的 Array.prototype.flat() 方法，并提供了使用示例和指导意义。使用 flat() 方法可以将多维数组展开为一维数组，简化编程，提高效率。这个方法是所有前端开发人员必须掌握的基本技能之一。

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