ES10中新增的Array.prototype.flat()的语法及实战应用

前言

在ES2019中，Array对象新增了一个新的实例方法Array.prototype.flat()。该方法用于将一个嵌套的数组“展开”，并返回一个新的一维数组。在本文中，我们将介绍这个新方法的语法、用法、实战应用以及指导意义。

语法

Array.prototype.flat()方法的语法如下：

array.flat(depth);

其中：

• array：被展开的数组。
• depth：可选，表示展开的深度。默认值为1。

举例

下面是一个简单的例子，展示了如何使用flat()方法：

const nestedArray = [1, 2, [3, 4, [5, 6]]];
const flattenedArray = nestedArray.flat();

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

在上面的例子中，我们首先定义了一个嵌套数组。然后我们使用flat()方法对其进行展开，并赋值给一个新的变量。最后，我们打印了展开后的数组。

可以看出，flat()方法将所有的嵌套数组展开，并返回一个新的一维数组。注意，flattenArray()方法只会展开一层深度。如果要展开多层深度，请使用depth参数。

const evenMoreNestedArray = [1, [2, [3, [4, [5, [6]]]]]];
const flattenedArray2 = evenMoreNestedArray.flat(Infinity);

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

在上面的例子中，我们定义了一个更加深度的嵌套数组，并使用Infinity值作为depth参数。这将把所有嵌套数组全部展开为一个一维数组。

实战应用

flat()方法是一个非常实用的方法，在许多实际场景中都非常有用。下面是一些示例用例：

1. 数组去重

我们可以使用flat()方法来对一个二维数组进行去重：

const duplicateArray = [[1, 2], [2, 3], [3, 4]];
const uniqueArray = [...new Set(duplicateArray.flat())];

console.log(uniqueArray); // [1, 2, 3, 4]

在上面的例子中，我们首先定义了一个含有重复元素的二维数组。然后，我们使用flat()方法将其展开为一维数组，并利用Set对象将其中的重复元素去掉，最终得到了一个去重后的一维数组。

2. 数组合并

我们可以使用flat()方法来将多个一维数组合并为一个数组：

const array1 = [1, 2, 3];
const array2 = [4, 5, 6];
const array3 = [7, 8, 9];
const mergedArray = [].concat(...[array1, array2, array3].flat());

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

在上面的例子中，我们首先定义了三个一维数组。然后，我们使用flat()方法将这三个数组展开，最终得到一个包含所有元素的一维数组。

指导意义

flat()方法有助于让代码更加简洁、易懂和易维护。使用flat()方法可以避免进行一些不必要的循环嵌套等复杂操作。因此，如果你经常需要操作数组嵌套，那么flat()方法肯定会成为你的好帮手。

结论

以上是关于ES10中新增的Array.prototype.flat()方法的介绍。该方法可以用于展开一个嵌套的数组，并返回一个新的一维数组。语法非常简单，用法十分实用，可以让代码更加简洁、易懂和易维护。

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