这是我参与8月更文挑战的第5天，活动详情查看：8月更文挑战
前言
我们经常在业务上或者面试的时候遇到需要
把多维数组转成一维数组？
今天就讲讲实现的几种方法，总结一下，加深印象，大家有兴趣可以探讨一下。
concat方法
数组的concat方法，用于拼接多个数组，最后返回一个拼好的新数组。
arr.concat(arr1, arr2, arr3,...)
基本用法：
let arr = [1,2,3]
const newArr = arr.concat([4,5,6])
console.log(newArr) // [1, 2, 3, 4, 5, 6]
arr1，arr2，...不局限于是数组，可以是其他类型
let arr = [1,2,3]
const newArr = arr.concat(4,5,6)
console.log(newArr) // [1, 2, 3, 4, 5, 6]
利用concat把多维数组转成一维数组
let arr = [[1],[2],3]
// 第一种方法
const newArr = [].concat(...arr)
console.log(newArr) // [1, 2, 3]
// 第二种方法
const newArr1 = [].concat.apply([], arr)
console.log(newArr1) // [1, 2, 3]
测试通过，可以把多维数组转成一维数组。
先别高兴的太早，再看个例子
let arr = [[1],[[2]],3]
// 第一种方法
const newArr = [].concat(...arr)
console.log(newArr) // [1, [2], 3]
从以上例子可以看出，concat方法只支持于二维数组，如果是三维或者更多维数组，它就处理不了。
递归遍历
那针对比二维数组还复杂的多维数组该怎么办？
可以使用递归遍历。
先看代码：
let arr = [[1],[[[2]]],[[[3]]]]
function flat (arr, flatArr = []) {
arr.forEach(item => {
if(Array.isArray(item)) flat(item, flatArr)
else flatArr.push(item)
})
return flatArr
}
flat(arr) // [1, 2, 3]
解析：
- 我们先定义一个flat函数，在这个函数里面，我们对
arr进行遍历 - 如果遍历到的元素是
数组，则会继续递归调用flat函数，知道遍历的元素不是元素 - 如果遍历到的元素不是数组，则把它push到flatArr中
- 最后返回flatArr数组，这时候flatArr里面的就是一维数组。
flat方法
flat是es6新增的方法。它可以用来扁平化数组，把多维数组转成一维数组。
下面来看看它的用法
arr.flat(depth)
- depth
可选，depth为需要把几层的数组来扁平化，默认是1。
[1,[2],[3]].flat() // [1, 2, 3]
// 等同于
[1,[2],[3]].flat(1) // [1, 2, 3]
当你的数组的层级是不清楚的时候，你可以把depth设置为Infinity, 代表的是无限级.
[[[1]],[2],[[[[3]]]]].flat(Infinity) // [1, 2, 3]
值得一提的是，es6还新增了一个flatMap方法。它会对数组的每个元素都执行回调函数，返回由返回值组成的新数组，最后对新数组调用flat()
语法：
arr.flatMap(fn)
注意，flatMap只支持flat一层
下面通过例子来看看
var arr = [1,[2],[3]]
arr.flatMap(item => item) // [1, 2, 3]
var arr = [1,[2],[3]]
arr.flatMap(item => [item]) // [1, [2], [3]]
感觉flatMap方法等同于数组先调用map方法后再调用flat(),你们觉得呢？
总结
针对上面讲的方法
-
如果你的数组就是二维的，那么你就可以使用concat方法
-
如果你想试试新语法，那么你可以使用flat方法
-
如果想兼容性好，不想用pollyfill，那么就可以考虑递归遍历
以上就是我总结的把多维数组转成一维数组的几种方法，大家如果有更好的方法欢迎评论沟通。
感谢你们的阅读，希望对你们有帮助。
