js将多维数组变成一维数组

一.js多维数组转换成一维数组
 //1.递归:注意这个不兼容IE

 function arrReduce(someArr){
    for(let i = 0;i< someArr.length;i++ ){
        if(Array.isArray(someArr[i])){
            arrReduce(someArr[i]);
        }else{
            arrMax.push(someArr[i]);
        }
    } 
 }
let content = [1,2,3,4,5,[6,7,[8,9,10,[11,12,13]]]];
let arrMax = [];//存放转换数组元素
arrReduce(content);
console.log(arrMax);

----------------------------------------------------------------------------------------------------------------------------------------------------------
//2.reduce方法

let arr1 = [1,[2,[[3,4],5],6,7,[8,9,[10,11,[12,13]]]]];
const flatten1 = arr1 => arr1.reduce((acc,val) => acc.concat(Array.isArray(val)? flatten1(val):val),[],)
console.log(flatten1(arr1));

//3.数组的join()

let arr1 = [1,[2,[[3,4],5],6,7,[8,9,[10,11,[12,13]]]]], newArray = new Array();
//输入的一维数组全是number类型
for(let item of arr1.join().split(",")){
     newArray.push(Number(item));
}
console.log(newArray);

//4.toString

let arrPol = [1,[2,[[3,4],5],6,7,[8,9,[10,11,[12,13]]]]], newArray = new Array();
for(let item of arrPol.toString().split(',')){
     newArray.push(Number(item));
}
console.log(newArray);

//5.空字符串''

let arrKol = [1,[2,[[3,4],5],6,7,[8,9,[10,11,[12,13]]]]];
let newArr = [];
for(let item of (arrKol + '').split(',')){
     newArr.push(Number(item));
}
console.log(newArr);

//6.ES6的flat(n): n非必填项,n默认是1,表示扁平化深度.

//默认转化成一维
console.log([1,[2,[[3,4],5],6,7,[8,9,[10,11,[12,13]]]]].flat()); // [1,2,3,3,4,5,6,7,8,9,10,11,12,13]
 
// 指定转换的嵌套层数
console.log([1,[2,[[3,4],5],6,7,[8,9,[10,11,[12,13]]]]].flat(2)); //[1, 2, Array(2), 5, 6, 7, 8, 9, Array(3)]
 
// 不管嵌套多少层
console.log([1,[2,[[3,4],5],6,7,[8,9,[10,11,[12,13]]]]].flat(Infinity)); // [1,2,3,3,4,5,6,7,8,9,10,11,12,13]
 
// 自动跳过空位
console.log([1, [2, , 3, ,4]].flat()); // [1, 2, 3, 4]

总结:

       这些都是综合比较得来的,实现办法太多了,还有map(),reduce()+递归,es6新增的扩展运算符,flatMap()...前端本身就是一个在寻求更加完美的解决过程,而不是满足于某一种方式实现,我们追求近乎完美的过程中提升自我,寻找平衡。

参考来源:

1.多维数组变成一维数组

2.javascript多维数组转一维数组

3.js将多维数组转换为一维数组

猜你喜欢

转载自blog.csdn.net/XU441520/article/details/108770467
今日推荐