Array.prototype.flat

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

语法

interface Array<T> {
  flat: (depth?: number) => T[]; // depth 默认为1
}
arr.flat(depth)

栗子

// 默认只展开第一层
console.log([1, 2, 3, [4, [5, 6], [7], 8]].flat())
// 结果为 [1,2,3,4,[5,6],[7],8]

// 只展开2层内
console.log([1, 2, 3, [4, [5, 6], [7], 8]].flat(2))
// 结果为 [1,2,3,4,5,6,7,8]

// 无限层级
console.log([1, 2, 3, [4, [5, 6], [7], 8]].flat(Infinity))
// 结果为 [1,2,3,4,5,6,7,8]

2. 多维数组去重排序

const arr = [[1, 2, 2], [3, 4, 5, 5], [6, 7, 8, 9, [11, 12, [12, 13, [14]]]], 10]

Array.from(new Set(arr.flat(Infinity))).sort((a, b) => a - b)

重点

1. 如果想提升所有层级可以写一个比较大的数字甚至是 无限层级(Infinity) ，但不推荐这么做。

参考

MDN Array

Array.prototype.flatMap()

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

我们可以看到几个重点： 1. 深度值为 1 2. map方法

语法

var new_array = arr.flatMap(function callback(currentValue[, index[, array]]) {
    // return element for new_array
}[, thisArg])

栗子

const arr = [1, 2, 3, [4, 5, [6, 7, 8], 9], 10, { name: "张三" }]

console.log(arr.flatMap(num => num)) // [1,2,3,4,5, [6,7,8] ,9,10, { name: "张三" }]