在 ECMAScript 2019 (ES10) 中，新增了一个 Array 的方法，叫做 flatMap()。它可以让我们更方便地处理数组中的嵌套数组，同时也可以让代码更简洁、易读。在本文中，我们将会介绍 flatMap() 方法的用法，并提供一些实际的应用场景和示例代码。
flatMap() 方法的定义
flatMap() 方法是一个组合方法，它首先会对数组中的每个元素执行一个映射函数（map() 方法），然后将结果扁平化为一个新数组。这个扁平化的过程会将嵌套数组展开为一维数组。
flatMap() 方法的定义如下：
array.flatMap(callback(currentValue[, index[, array]])[, thisArg])
其中，callback 是一个用来处理数组元素的函数，它可以接收三个参数：当前元素的值（currentValue）、当前元素的索引（index）和整个数组（array）。如果指定了 thisArg 参数，则 callback 函数中的 this 指向 thisArg。
flatMap() 方法的应用实例
1. 将二维数组转化为一维数组
假设我们有一个二维数组，我们想要将它转化为一个一维数组。在过去，我们可能需要使用两个嵌套的 forEach() 方法来实现这个目标。但是现在，我们可以使用 flatMap() 方法来简化代码。
示例代码如下：
const twoDimensionalArray = [[1, 2], [3, 4], [5, 6]]; const oneDimensionalArray = twoDimensionalArray.flatMap((array) => array); console.log(oneDimensionalArray); // [1, 2, 3, 4, 5, 6]
在这个例子中，我们首先创建了一个二维数组 twoDimensionalArray。然后，我们使用 flatMap() 方法来将嵌套数组展开为一个一维数组。回调函数 array => array 就是一个简单的映射函数，它将每个嵌套数组映射为它本身。最终，我们得到了一个一维数组 oneDimensionalArray。
2. 将每个单词转化为一个数组元素
假设我们有一个字符串，我们想要将它分割成一个单词数组。在过去，我们可能需要使用 split() 方法和 map() 方法来实现这个目标。但是现在，我们可以使用 flatMap() 方法来简化代码。
示例代码如下：
const sentence = 'Hello world! How are you?';
const wordArray = sentence.split(' ').flatMap((word) => word);
console.log(wordArray); // ["H", "e", "l", "l", "o", "w", "o", "r", "l", "d", "!", "H", "o", "w", "a", "r", "e", "y", "o", "u", "?"]在这个例子中，我们首先创建了一个字符串 sentence。然后，我们使用 split() 方法将字符串分割成一个单词数组。接下来，我们使用 flatMap() 方法来将每个单词映射为一个字符数组。最终，我们得到了一个包含所有字符的数组 wordArray。
3. 获取嵌套数组中的所有值
假设我们有一个嵌套的数组，我们想要获取它中所有的值。在过去，我们可能需要使用多个嵌套的循环来实现这个目标。但是现在，我们可以使用 flatMap() 方法来简化代码。
示例代码如下：
-- -------------------- ---- -------
----- ----------- - --- --- --- --- ------
----- -------------- - --------------------------- -- -
-- ---------------------- -
------ -------------------------- -- ------------
- ---- -
------ ------
-
---
---------------------------- -- --- -- -- -- --在这个例子中，我们首先创建了一个嵌套的数组 nestedArray。然后，我们使用 flatMap() 方法来将嵌套数组展开为一个一维数组。回调函数 value => value 将每个非数组值映射为它本身。但是，对于每个数组值，我们需要使用嵌套的 flatMap() 方法来递归展开它们。最终，我们得到了一个包含所有值的数组 flattenedArray。
总结
flatMap() 方法是一个非常有用的方法，它可以让我们更方便地处理数组中的嵌套数组。在本文中，我们介绍了 flatMap() 方法的定义和用法，并提供了一些实际的应用场景和示例代码。希望这篇文章能够帮助你更好地理解 flatMap() 方法，并在实际开发中发挥它的作用。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6505034195b1f8cacd18dad2