作为一门主流的WEB编程语言，JavaScript 不断发展，添加新的语法、功能或抽象，帮助开发人员轻松解决复杂的问题。如数组展平过去需要自己编写方法来实现，而从 ES2019 中开始引入了一种扁平化数组的新方法，可以展平任何深度的数组，这个方法就是 flat() 。而说起 flat() 的方法，就不得不顺便说下 flatMap() 。
flat
flat() 方法创建一个新数组，其中所有子数组元素以递归方式连接到特定深度。
语法：array.flat(depth)
array ： flat() 方法将在给定的数组中使用。
depth：可选参数，指定展平的深度，默认情况下，深度为 1。
此方法会按照一个可指定的深度递归遍历数组，并将所有元素与遍历到的子数组中的元素合并为一个新数组返回。
constarr=[[1,2],[3,4],5];console.log(arr.flat());//[1,2,3,4,5]
flat() 方法也会移除数组中的空项：
constarr=[[1,2],,[3,4],5];console.log(arr.flat());//[1,2,3,4,5]
在一些复杂的场合，数组的层级不单一比较复杂的情况下，不必去逐个计算数组的嵌套深度，可以借助参数
Infinity，就可以将所有层级的数组展平。
constarrVeryDeep=[[1,[2,2,[3,[4,[5,[6]]]]],1]];console.log(arrVeryDeep.flat(Infinity));//[1,2,2,3,4,5,6,1]
flatMap
flatMap() 方法首先使用映射函数映射每个元素，然后将结果压缩成一个新数组。它与 map 连着深度值为 1 的 flat() 几乎相同，但 flatMap() 通常在合并成一种方法的效率稍微高一些。
语法
//ArrowfunctionflatMap((currentValue)=>{...})flatMap((currentValue,index)=>{...})flatMap((currentValue,index,array)=>{...})//CallbackfunctionflatMap(callbackFn)flatMap(callbackFn,thisArg)//InlinecallbackfunctionflatMap(function(currentValue){...})flatMap(function(currentValue,index){...})flatMap(function(currentValue,index,array){...})flatMap(function(currentValue,index,array){...},thisArg)callbackFn：处理新数组元素的回调函数，接收三个参数
currentValue：数组中正在处理的当前元素。
index：可选参数，数组中正在处理的当前元素的索引。
array：可选参数，调用了数组 map()。
thisArg：执行 callbackFn 时用作 this 的值
此方法返回一个新数组的值，其中每个元素都是通过回调函数的处理过的结果，并将其展平到深度为 1。
constuserRunning1={movements:[1000,4500,500,1200],};constuserRunning2={movements:[2000,4500,2500,12000],};constuserRunning3={movements:[10000,5000,1500,800],};constallRunning=[userRunning1,userRunning2,userRunning3];//flatconstoveralDistance=allRunning.map((acc)=>acc.movements).flat().reduce((acc,mov)=>acc+mov,0);console.log(overalDistance);//45500//flatMapconstoveralDistance2=allRunning.flatMap((acc)=>acc.movements).reduce((acc,mov)=>acc+mov,0);console.log(overalDistance2);//45500上述代码通过 flat() 方法和 flatMap() 方法来解决同样问题，将所有用户的跑步记录进行累加。
flatMap()展平的深度值为1，而flat()可以指定多级。