JavaScript 数组之flat和flatMap

flat

flat 方法会按照一个指定的深度递归遍历数组，并将所有元素与遍历到的子数组中的元素合并为一个新数组返回

语法：arr.flat([depth])
depth：（可选）指定要提取嵌套数组的结构深度，默认值为1
返回值：一个包含将数组与子数组中所有元素的新数组

const arr = [1, 2, [3, 4]]
arr.flat()  // [1, 2, 3, 4]

const arr1 = [1, 2, [3, 4, [5, 6]]]
arr1.flat()  // [1, 2, 3, 4, [5, 6]]

const arr2 = [1, 2, [3, 4, [5, 6]]]
arr2.flat(2)  // [1, 2, 3, 4, 5, 6]

// 使用infinity，可展开任意深度的嵌套数组
const arr3 = [1, 2, [3, 4, [5, 6, [7, 8, [9, 10]]]]];
arr3.flat(Infinity)  // [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]

// flat方法会移除数组中的空项
const arr4 = [1, 2, , 4, 5];
arr4.flat()  // [1, 2, 4, 5]

flatMap

flatMap方法首先使用映射函数映射每个元素，然后将结果压缩成一个新数组。它与map连着深度值为1的flat几乎相同，但flatMap通常在合并成一种方法的效率稍微高些。

语法：const result = arr.flatMap(function callback(currentValue[, index[, array]]) {}[, thisArg])
callback：遍历数组中每个元素的回调函数，可以传入三个参数
   currentValue：当前正在处理的数组元素
   index：（可选）当前正在处理的元素的下标
   array：（可选）被调用的数组
thisArg：（可选）执行回调函数时指定的this值
返回值：一个新的数组，其中每个元素都是回调函数的结果，并且结构深度depth为1

const arr = [1, 2, 3, 4, 5]
arr.flatMap(item => [item * 2])  // [1, 2, 3, 4, 5]
arr.flatMap(item => [[item * 2]])  // [[2], [4], [6], [8], [10]]