Array.prototype.flatMap

[mowatermelon]

基础语法

var new_array = arr.flatMap(function callback(currentValue[, index[, array]]) {
    // 返回新数组的元素
}[, thisArg])

---

参数说明

callback

在数组每一项上执行的函数，接收 3 个参数：

• currentValue

当前正在数组中处理的元素

---

• index

当前遍历到的索引。

---

• array

数组本身。

---

thisArg 可选

可选，指定 callback 的 this 参数。

---

返回值说明

一个新的数组，其中每个元素都是回调函数的结果，并且结构深度 depth 值为1。

---

详细说明

flatMap() 方法首先使用映射函数映射每个元素，然后将结果压缩成一个新数组。

它与 map 和 深度值1的 flat 几乎相同，但 flatMap 通常在合并成一种方法的效率稍微高一些。

有关回调函数的详细描述，请参见 [Array.prototype.map()][map] 。 flatMap 方法与 [map][map] 方法和深度depth为1的 [flat][flat] 几乎相同.

---

案例

Map 与 flatMap

var arr1 = [1, 2, 3, 4];

arr1.map(x => [x * 2]); 
// [[2], [4], [6], [8]]

arr1.flatMap(x => [x * 2]);
// [2, 4, 6, 8]

// 只会将 flatMap 中的函数返回的数组 “压平” 一层
arr1.flatMap(x => [[x * 2]]);
// [[2], [4], [6], [8]]

---

包含几句话的数组拆分成单个汉字组成的新数组

let arr = ["今天天气不错", "", "早上好"]

arr.map(s => s.split(""))
// [["今", "天", "天", "气", "不", "错"],[""],["早", "上", "好"]]

arr.flatMap(s => s.split(''));
// ["今", "天", "天", "气", "不", "错", "早", "上", "好"]

---

替代方案

归纳（reduce） 与 合并（concat）节

var arr1 = [1, 2, 3, 4];

arr1.flatMap(x => [x * 2]);
// 等价于
arr1.reduce((acc, x) => acc.concat([x * 2]), []);
// [2, 4, 6, 8]

---