JavaScript Array flatMap()用法及代码示例

JavaScript大批flatMap()方法用于展平和映射数组的元素。它的工作原理是将提供的函数应用于数组的每个元素，然后将结果展平到一个新数组中。

JavaScript 中使用此方法来映射数组的元素并将结果展平到新数组中。当您想要执行可能为每个元素返回数组的映射操作，并且您希望最终结果是单个展平数组时，这特别方便。

例子：

const words = ["Hello", "world", "how", "are", "you"];  
const result = words.flatMap(word => word.split('')); 
console.log(result); // Output: ["H", "e", "l", "l", "o", "w", "o", "r", "l", "d", "h", "o", "w", "a", "r", "e", "y", "o", "u"]

用法:

let A = array.flatMap(function callback(current_value, index, Array)) {
// It returns the new array's elements.
}

参数：

• current_value:它是输入数组元素。
• index:
  • 它是可选的。
  • 它是输入元素的索引。
• Array:
  • 它是可选的。
  • 当调用数组映射时使用它。

返回值：它返回一个新数组，其元素是回调函数的返回值。

示例 1：在此示例中，flatMap()方法用于对数字数组执行对偶运算。使用回调函数将每个数字加倍并平方，从而产生一个新数组。这flatMap()函数确保为每个数字生成的各个数组被展平为单个数组，从而生成具有双倍和平方值的最终数组。

const numbers = [1, 2, 3, 4];
const doubledAndSquared = numbers.flatMap(num => [num * 2, num ** 2]);
console.log(doubledAndSquared);

[
  2, 1, 4,  4,
  6, 9, 8, 16
]

示例 2：在此示例中，flatMap()方法用于处理句子数组。回调函数，sentence => sentence.split(' ')，应用于每个句子，将其拆分为单词数组。这 flatMap()方法然后将这些数组展平为单维单词数组。

const sentences = ["Hello world", "How are you?", "JavaScript is fun"];
const words = sentences.flatMap(sentence => sentence.split(' '));
console.log(words);

[ 'Hello', 'world', 'How', 'are', 'you?', 'JavaScript', 'is', 'fun' ]

我们有 Javascript 数组方法的完整列表，要检查这些方法，请浏览此Javascript 数组完整参考文章。

支持的浏览器：

• 谷歌浏览器 69 及以上版本
• 边 79 及以上
• 火狐 62 及以上版本
• Opera 56 及以上
• Safari 12 及以上版本

注意：此方法仅在 Firefox Nighty 中可用。

我们有一份关于 Javascript 的备忘单，其中涵盖了 Javascript 的所有重要主题，请查看这些主题Javascript Cheat Sheet-A JavaScript 基本指南.