面试常客之数组扁平化（手撕代码篇）

今天来小结一下面试中常问的一个问题：数组扁平化。

JS引用数据类型，数组。除了常见的一维数组，如

let arr = [1,2,3,4,5]

还有二维数组和多维数组，如

let arr2 = [1,2,3,[4,5],[6,7],8]
let arr3 = [1,2,3,[4,5],[6,7,[8,9]]]

有时候我们需要将这些数组转化成一维数组，这个过程就叫做数组扁平化。

以下就是几种常见的数组扁平化的方法：

1、递归法

思想：遍历数组，判断数组的某项是否还是数组，如果不是，直接放入新数组里面，如果该项是数组，则继续将该项的数组进行遍历，递归调用同样的方法，将结果与上层结果进行拼接。

//定义一个数组扁平化函数
function flatten(arr){
	var res = []
	for(var i=0; i<arr.length; i++){
		if(Array.isArray(arr[i])){  //判断数组里面的项是否还是数组
			res = res.concat(flatten(arr[i]))  //如果是，递归执行扁平化函数
		}else{
			res.push(arr[i]) //如果不是，则将该项放入新数组中
		}
	}
	return res
}

let arr = [1,2,3,[4,5],[6,7,[8,9]]]
let res = flatten(arr)
console.log(res)

2、ES6扩展运算符（...）

扩展运算符可以对数组进行展开，如

let arr = [1,2,3,4,5]
console.log(...arr)  //1,2,3,4,5

根据这个思想，我们可以对多维数组进行一层层展开，如

let arr = [1,2,3,4,[5,6]]
console.log(...arr)  //展开最外层 1 2 3 4 [5,6]

每使用一次扩展运算符，会展开一层，这样我们可以多次使用，使得数组里面的数组全部展开。

tips：some()方法是判断数组中的某一项是否满足某个条件，有一个条件满足，则返回true。

function flatten(arr){
  while(arr.some(item => Array.isArray(item))){
    console.log(arr)   //控制台打印，看每一步的结构
    arr = [].concat(...arr)
  }
  return arr
}

let arr = [1, 2, 3, 4, [5, 6, [7, 8, [9, 10]]]]
let res = flatten(arr)
console.log(res)  //[1,2,3,4,5,6,7,8,9,10]

控制台打印的层级结构

3、ES2019引入 flat()

ES2019引入flat()方法，可以递归到指定深度将所有数组连接，返回一个新数组。

let arr = [1,2,3,4,[5,6]]
console.log(arr.flat(1))  //[1,2,3,4,5,6]

let arr1 = [1,2,3,4,[5,6,[7,8]]]
console.log(arr1.flat(2))  //[1,2,3,4,5,6,7,8]

如果不确定多维数组的层数，那么可以用 Infinity 代表“无穷大”。

let arr = [1,2,3,......]  //很多层数组，具体不清楚
let res = arr.flat(Infinity)
console.log(res)   //达到效果