Please enable Javascript to view the contents

JavaScript 数组降维打击 Array.flat()

 ·  ☕ 1 分钟

你以前是怎么样扁平化数组,也许是这样:

Array.prototype.concat.apply([], [["a"], ["b"]]) // [ 'a', 'b' ]

以上代码确实成功了,但它很长,理解起来也比较晦涩,apply方法被我们广泛的当成高级技巧刻入脑海。

现在,你再也不需要这个高级技巧了。ES2019 引入了一个新的数组方法 Array.flat()。

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

var newArray = arr.flat([depth])

depth 参数是可选的,默认为1。

let arr=[1,2,3,[4,5,6,[7,8,9,[10,11,12]]
// flat()等效flat(1),把子数组1层打平
arr.flat() //[1,2,3,4,5,6, Array(4)]

// flat().flat()等效flat(2),把子数组2层打平
arr.flat().flat() // [1,2,3,4,5,6,7,8,9, Array(3)]

// flat().flat().flat() 等效于flat(3)
arr.flat().flat().flat() // [1,2,3,4,5,6,7,8,9,10,11,12]

// flat(Infinity) 直接把数组干平
arr.flat(Infinity) // [1,2,3,4,5,6,7,8,9,10,11,12]

// falt() 还可以去除空值
[1,2,,4].flat() // [1,2,4]

目前除旧版的IE,IE edge及其它浏览器都支持该特性。

分享

码中人
作者
码中人
Web Developer