数组扁平化就是把多维数组转化成一维数组。
数组扁平化的方法
1、 es6 flat(depth)
flat(depth) 方法中的参数depth,代表展开嵌套数组的深度,默认是1
以下需要知道数组的维度
[1,2,[3,4],5].flat();
//(5) [1, 2, 3, 4, 5]
[1,2,[3,4,[6,7]],5].flat()
//(6) [1, 2, 3, 4, [6, 7], 5]
[1,2,[3,4,[6,7]],5].flat(2)
//(7) [1, 2, 3, 4, 6, 7, 5]
更简单的方法无需知道数组的维度,直接将目标数组变成1维数组。depth的值设置为Infinity。
let a = [1,[2,3,[4,[5]]]];
a.flat(Infinity); // [1,2,3,4,5] a是4维数组
2、 for循环
let arr1 = [1, 2, 3, [1, 2, 3, 4, [2, 3, 4]]];
function flatten(arr) {
let res = [];
for (let i = 0, length = arr.length; i < length; i++) {
if (Array.isArray(arr[i])) {
res = res.concat(flatten(arr[i])); //concat 并不会改变原数组
//res.push(...flatten(arr[i])); //扩展运算符
} else {
res.push(arr[i]);
}
}
return res;
}
flatten(arr1); //[1, 2, 3, 1, 2, 3, 4, 2, 3, 4]
利用for循环遍历数组的每一项并加以判断,如果不是数组,就执行push操作,是数组的化,就再次执行该函数(递归),直至遍历完整个数组。
...和concat()可以进行替换。
3、 reduce()方法
reduce() 方法接收一个函数作为累加器,数组中的每个值(从左到右)开始缩减,最终计算为一个值。
var arr1 = [1, 2, [3], [1, 2, 3, [4, [2, 3, 4]]]];
function flatten(arr) {
return arr.reduce((res,next) =>{
return res.concat(Array.isArray(next)? flatten(next) : next);
},[]);
}
这里使用的是数组的reduce方法,需要注意的是reduce方法,我们传递了两个参数,
第一个参数就是就是处理扁平化的箭头函数,第二个参数是一个空数组,也是作为遍历的开始。(res)
4、 toString()方法
无论数组多深,只要你toString一下,他们的结构就没有了。
var arr = [[1, 2, 3], [4, [5, 6]]];
//用split分隔逗号,生成一个单个字符串数组。
let arr1 = arr.toString().split(',') // ["1", "2", "3", "4", "5", "6"]
//转化为数字
let arrnum = arr1..map((item) => parseInt(item))
console.log(arrnum) // [1,2,3,4,5,6]
5、concat() + 拓展运算符
var arr = [1,2,3,4,5,[6,7]]
[].concat(...arr)
//(7)[1, 2, 3, 4, 5, 6, 7]
[].concat(1,2,3,4,5,[6,7,[8,9]])
//(8) [1, 2, 3, 4, 5, 6, 7, Array(2)]
此方法的优势:可读性强;缺点:项中最多一层深度的扁平化