`Array.prototype.flat` 和 `Array.prototype.flatMap`

发布时间 2019-06-11 · 标签： ECMAScript ES2019

`Array.prototype.flat` #

此示例是一个深度嵌套数组：它包含一个数组，该数组又包含另一个数组。

const array = [1, [2, [3]]];
//            ^^^^^^^^^^^^^ 外层数组
//                ^^^^^^^^  内层数组
//                    ^^^   更内层数组

Array#flat 将一个数组展平，并返回展平后的数组。

array.flat();
// → [1, 2, [3]]

// …is equivalent to:
array.flat(1);
// → [1, 2, [3]]

默认深度为 1，但您可以传递任何数字以递归展平到该深度。如果想要递归展平一个数组，直到结果不再包含嵌套数组，可以传递 Infinity。

// 递归展平数组，直到结果不再包含嵌套数组:
array.flat(Infinity);
// → [1, 2, 3]

为什么这个函数名字是 Array.prototype.flat 不是 Array.prototype.flatten？阅读我们的 #SmooshGate 文章，了解相关信息！(中文版)

这是另一个例子。我们有一个 duplicate函数，它接受一个值作为参数，并返回一个包含该值两次的数组。如果我们对数组中的每个值调用 duplicate ，我们最终会得到一个嵌套数组。

const duplicate = (x) => [x, x];

[2, 3, 4].map(duplicate);
// → [[2, 2], [3, 3], [4, 4]]

然后，您可以对结果调用 flat 来展平数组：

[2, 3, 4].map(duplicate).flat(); // 🐌
// → [2, 2, 3, 3, 4, 4]

由于这种模式在函数式编程中非常常见，现在有一个专门的 flatMap 函数。

[2, 3, 4].flatMap(duplicate); // 🚀
// → [2, 2, 3, 3, 4, 4]

flatMap 与单独执行 flat 并执行 map 相比，效率更高一些。

如果对 flatMap 感兴趣？查看 Axel Rauschmayer 的解释。