JS数组降维的多种实现方式

业务开发中，二维数组、多维数组转为一维数组这种需求是少不了的，有些多维数组里面可能嵌套会更深，数组降维就是来解决此问题的，以下介绍三种实现方式。

数组字符串化

利用数组与字符串的隐式转换，使用+符号链接一个对象，javascript会默认调用toString方法转为字符串，再使用字符串分割成字符串数组，最后转成数值形数组

let arr = [[222, 333, 444], [55, 66, 77], {a: 1} ]
	arr += '';
	arr = arr.split(',');
	
console.log(arr); // ["222", "333", "444", "55", "66", "77", "[object Object]"]

这也是比较简单的一种方式，从以上例子中也能看到问题，所有的元素会转换为字符串，且元素为对象类型会被转换为 "[object Object]" ，对于同一种类型数字或字符串还是可以的。

利用apply和concat转换

concat() 方法用于连接两个或多个数组。该方法不会改变现有的数组，而仅仅会返回被连接数组的一个副本。

apply方法会调用一个函数，apply方法的第一个参数会作为被调用函数的this值，apply方法的第二个参数（一个数组，或类数组的对象）会作为被调用对象的arguments值，也就是说该数组的各个元素将会依次成为被调用函数的各个参数；将该特性应用到代码中

function reduceDimension(arr) {
    return Array.prototype.concat.apply([], arr);
}

console.log(reduceDimension([[123], 4, [7, 8],[9, [111]]]));
// [123, 4, 7, 8, 9, Array(1)]

以上apply的第二个参数arr，会将其每个数组元素做为参数传入contact，等同于 [].concat([123], 4, [7, 8],[9, [111]])

采用递归实现多维数组降纬

function arrayConcat(arr, point){
    return Array.prototype.concat.apply(point || [], arr);
}

function reduceDimension(arr) {
    let arrays = arrayConcat(arr);
    let newArray = [];

    for(let key in arrays){
        if(arrays[key] instanceof Array){
            newArray = arrayConcat(arrays[key], newArray);
        }else{
            newArray.push(arrays[key]);
        }
    }

    return newArray;
}

let arr = [[12], 4, [333, [4444, 5555]], [9, [111, 222]]];

for(let i = 0; i < 100000; i++){
    arr.push(i*1);
}

let start = new Date().getTime();
console.log('reduceDimension: ', reduceDimension(arr));
console.log('耗时: ', new Date().getTime() - start);

最佳实践方式

可以实现多维数组降维，实际测试效率也高于利用apply和concat转换，推荐此方法。

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;
}

let arr = [[12], 4, [333, [4444, 5555]], [9, [111, 222]]];

for(let i = 0; i < 100000; i++){
    arr.push(i);
}

let start = new Date().getTime();

console.log('reduceDimension: ', reduceDimension(arr));
console.log('耗时: ', new Date().getTime() - start);