【js笔记】跟着大佬学习之数组扁平化

我们在平时写代码的时候，往往会发现一个问题，就是前端控制不了后端返回的数据，或者有时候因为业务逻辑等其他的原因，后端返回的数据不是我们前端想要的东西，所以这时候我们就需要去进行处理，今天就来和大家讲一讲其中一种对多维数组的处理方式。
让数组多维数组扁平化

数组的扁平化

一、递归

递归是最常见的一种方式啦

示例：

var arr=[1,[2,3,[4,5,6,{a:'888'}],9]10,82]

function flatten(arr){
    let result=[]
    arr.forEach(element => {
        if(Array.isArray(element)){
            result=result.concat(flatten(element))
        }else{
            result.push(element)
        }
    });
    return result
}

flatten(arr) [1, 2, 3, 4, 5, 6, {a:'888'}, 9, 10, 82]

二、es6中的扩展运算符-解构

// 二、es6中的解构运算符
function flatten(arr){

    // arr.some()---检测数组中是否有满足条件的元素，如果有一个，就立刻返回true
    //while循环开始后，先会判断条件是否满足，如果满足就会执行循环体内的语句，执行完毕之后再回来判断条件是否满足
    while(arr.some(item=>Array.isArray(item))){
        arr=[].concat(...arr)
    }
    return arr
}
flatten(arr)

console.log(flatten(arr));  //[1, 2, 3, 4, 5, 6, {a:'888'}, 9, 10, 82]

三、reduce累加器

function flatten(arr){
    var result=arr.reduce((pre,cur)=>{
    return pre.concat(Array.isArray(cur)?flatten(cur):cur)
    },[])
    return result
}
flatten(arr)

四、toString()方法-有其局限性

把数组变成字符串再拼接只适用于元素都是数字的形式，对象的话会出现问题

 var arr=[1,[2,3,[4,5,6,8],9],10,82]
 

function flatten(arr){
return arr.toString().split(',').map(item=>{
    return +item
})
}
flatten(arr)
console.log(flatten(arr));  //[1, 2, 3, 4, 5, 6, {a:'888'}, 9, 10, 82]