在 ES9 中，新增了一个 Array.prototype.flatMap() 方法，可以让我们更方便地处理数组中的嵌套数组，本文将介绍它的使用技巧。
简介
Array.prototype.flatMap() 方法的作用是对原数组的每个元素执行一个指定的函数，然后将所有结果放入一个新的数组中。第一次结果是一个扁平化的结果，这个结果是可迭代的，也可以应用一个 reduce 方法的进一步规约。
其语法如下：
arr.flatMap(callback[, thisArg])
其中，callback 是一个函数，它接受三个参数：当前元素，元素索引，原数组本身。thisArg 是可选的，为 callback 函数提供 this 上下文。
值得注意的是，Array.prototype.flatMap() 方法会将嵌套数组自动扁平化为一维数组。这样，我们就可以更方便地操作嵌套数组了。
使用示例
下面是一个简单的例子，演示了如何使用 Array.prototype.flatMap() 方法来处理嵌套数组：
const arr = [1, 2, 3, 4, 5]; const result = arr.flatMap((x) => [x * 2]); console.log(result); // [2, 4, 6, 8, 10]
上面的代码中，我们首先定义了一个普通的数组 arr，然后使用 flatMap() 方法将其中的元素乘以 2，最后得到了一个新的数组 result。
接下来看一个更复杂的例子，演示了如何使用 flatMap() 方法来处理嵌套数组：
const arr = [1, 2, 3, 4, 5]; const result = arr.flatMap((x) => [[x * 2]]); console.log(result); // [[2], [4], [6], [8], [10]]
上面的代码中，我们首先定义了一个普通的数组 arr，然后使用 flatMap() 方法将其中的元素乘以 2 并将结果放入一个嵌套的数组中，最后得到了一个新的数组 result。
需要注意的是，如果 callback 返回一个数组，则返回的结果将是一个扁平化的数组，如果 callback 返回一个单独的值，则返回的结果也将是一个扁平化的数组，但它的深度只有 1。
深入理解 flatMap() 方法
下面是一个更为深入的例子，演示了如何使用 flatMap() 方法来处理深层嵌套的数组：
const arr = [1, 2, [3, 4], [[5]]]; const result = arr.flatMap((x) => x); console.log(result); // [1, 2, 3, 4, [5]]
上面的代码中，我们首先定义了一个包含两级嵌套的数组 arr，然后使用 flatMap() 方法将其中的元素每个都返回回去，最后得到了一个新的数组 result。
需要注意的是，flatMap() 方法会自动扁平化数组，并且只会扁平化一级。如果要扁平化多级数组，可以使用递归来实现。
总结
Array.prototype.flatMap() 方法是一个十分实用的方法。它可以帮助我们更方便地处理数组中的嵌套数组，提高代码的可读性和可维护性。
需要注意的是，我们在使用 flatMap() 方法时需要注意一些细节，尤其是对于嵌套数组的处理方式。在实际应用中，要灵活使用 flatMap() 方法，并根据实际情况进行使用和调整。
来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/65aac6f2add4f0e0ff45abff