js实现数组扁平化方法总结

数组扁平化：

将多维数组变为一维数组
arr = [1,2,[3,[4,5]]]
经扁平化处理后变为:
arr = [1,2,3,4,5]

1、arr.some+concat 实现数组扁平化

实现原理：some() 方法测试数组中是不是至少有1个元素通过了被提供的函数测试。它返回的是一个Boolean类型的值。
…arr(es6展开运算符)：[1,2,[3,4]] => 1,2,[3,4]
核心：[ ].concat(1,2,[3,[4,5]]) => [1,2,3,[4,5]]

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

function flatten(arr) {
    while (arr.some(item => Array.isArray(item))) {
        arr = [].concat(...arr);
    }
    return arr;
}
console.log(arr); //arr = [1,2,3,4,5]

2、toString+split+map 实现数组扁平化

实现原理：
var arr = [1,2,[3,[4,5]]]
arr.toString() => 1,2,3,4,5
arr.toString().split(’,’) => [“1”, “2”, “3”, “4”, “5”]
return arr.toString().split(’,’).map(item => Number(item)) => [1,2,3,4,5]
核心： Number(“1”) => 1

function flatten(arr) {
    return arr.toString().split(',').map(item => Number(item));
}

3、Array.prototype.flat()实现数组扁平化

实现原理：flat() 方法会按照一个可指定的深度递归遍历数组，并将所有元素与遍历到的子数组中的元素合并为一个新数组返回。
核心：使用 Infinity，可展开任意深度的嵌套数组

function flatten(arr) {
    return arr.flat(Infinity);
}

4、map+递归 实现数组扁平化

实现原理：创建空数组res追加非数组元素，push前先判断元素是否为数组，是数组则递归扁平函数，非数组则push到res数组里面，最终返回res数组。

function flatten(arr) {
    var res = [];
    arr.map(function(item) {
        if (Array.isArray(item)) {
            res = res.concat(flatten3(item));
        } else {
            res = res.push(item);
        }
    })
    return res;
}

5、reduce+递归 实现数组扁平化

实现原理：借用reduce方法, 判断数组中还有数组的话，递归调用flatten扁平函数(利用reduce扁平), 再用concat连接，返回扁平后数组。
核心：掌握reduce实现原理 可查看我的另一篇文章：介绍reduce

function flatten(arr){
    return arr.reduce(function(prev, cur){
        return prev.concat(Array.isArray(cur) ? flatten(cur) : cur)
    },[])
}

flatten(arr)   // [1,2,3,4]

注：以上列举的是较为常见的方法，其他方法请自行查阅相关资料。