引言

往往在开发中我们可能会遇到一些不平铺的，结构或是嵌套比较复杂的数组数据，那么我们面对这种数据的时候应该怎么优雅高效的处理他们的，今天让我们来学习一下使用flat()和flatMap来打平数组吧

使用flat()和flatMap来打平数组吧

今天我们来一起学习一下使用flat()和flatMap打平数组

在ES2019中,flat()方法用于创建并返回一个新数组，这个新数组包含于他调用flat()的数组相同的元素，只不过其中任何本身也是数组的元素会被打平填充到返回的数组中。例如：

[1,[2,3]].flat() //会变成[1,2,3]
[1,[2,[3]]].flat() //会变成[1,2,[3]]

在不传参调用的时候，flat()会打平一级嵌套，原始数组中本身也是数组的元素会被打平，但是打平后的元素如果还是在数组中则不会再打平。如果想打平更多层级，需要给flat()传一个数值参数:

let a = [1,[2,[3,[4]]]];
a.flat(1) // [1,2,[3,[4]]]
a.flat(2) // [1,2,3,[4]]
a.flat(3) // [1,2,3,4]
a.flat(4) // [1,2,3,4]

flatMap()方法于map()方法相似,只不过返回的数组会自动被打平，就像传给了flat()一样。换句话说，调用a.flatMap(f)等同于但是效率远高于a.map(f).flat()：

let phrases = ["hello world","balabala"];
let words = phrases.flatMap(phrase => phrase.split(" ");
console.log(words) // ["hello",world","balabala"];

可以把flatMap()想象为一个通用版的map()，可以把输入数组的一个元素映射为输出数组中的多个元素，特别地，flatMap()允许把输入元素映射为空数组，这样大屏后并不会有元素出现在数组中:

// 将非负数映射为他的平方根
[-2,-1,1,2].flatMap(x => x < 0 ? [] : Math.sqrt(x))
// 结果: [1,2**0.5]