js中数组扁平化的几种方法

1. 数组字符串化

 let arr = [[222, 333, 444], [55, 66, 77] ]
   arr += ''; // 222,333,444,55,66,77
   arr = arr.split(',') 
   console.log(arr) // ['222', '333', '444', '55', '66', '77']

• 将数组转化为字符串
• 使用split 将字符分割为数组形式

2. 递归

function reduceDimension(arr){
let ret = [];
let toArr = function(arr){
arr.forEach(function(item){
item instanceof Array ? toArr(item) : ret.push(item);
});
}
toArr(arr);
return ret;
}

1. 传入数组, 我们先创建一个空的数组用于映射关系
2. 定义处理函数,传入arr , 使用forEach 遍历 数组中的每一项,判断item是否是数组 ,如果是数组,则继续调用循环处理函数,再次循环,不是数组则push添加到定义的ret空数组中

3. Array.prototype.flat()

flat() 方法会按照一个可指定的深度递归遍历数组，并将所有元素与遍历到的子数组中的元素合并为一个新数组返回。
语法: var newArray = arr.flat([depth])
参数: depth 可选

• 指定要提取嵌套数组的结构深度，默认值为 1。
  返回值
• 一个包含将数组与子数组中所有元素的新数组。

var arr1 = [1, 2, [3, 4]];
arr1.flat();
// [1, 2, 3, 4]
var arr2 = [1, 2, [3, 4, [5, 6]]];
arr2.flat();
// [1, 2, 3, 4, [5, 6]]
var arr3 = [1, 2, [3, 4, [5, 6]]];
arr3.flat(2);
// [1, 2, 3, 4, 5, 6]
arr3.flat(Infinity);
// [1, 2, 3, 4, 5, 6]

第一个: flat默认为1 , 能解决二维数组
第二个: 这个为三维数组,flat默认能解决一层嵌套,得出的结果是一个二维数组
第三个: 传入2 , 三维数组,被提取为一个正常的一维数组
第四个: 使用 Infinity 作为深度，展开任意深度的嵌套数组

4. 使用 reduce、concat 和递归无限反嵌套多层嵌套的数组

var arr1 = [1,2,3,[1,2,3,4, [2,3,4]]];
function flattenDeep(arr1) {
return arr1.reduce((acc, cur) => Array.isArray(cur) ? acc.concat(flattenDee
p(cur)) : acc.concat(cur), []);
}
flattenDeep(arr1);
// [1, 2, 3, 1, 2, 3, 4, 2, 3, 4]

• 首先复习一下concat的用法

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

• acc为累加器,cur是当前项,判断当前每一项是否为数组类型, 如果为数组,则继续调用这个处理函数.使用concat合并到acc数组中,不是数组则直接合并到acc中