JavaScript 数组扁平化

扁平化的实现

数组的扁平化其实就是将一个嵌套多层的数组 array（嵌套可以是任何层数）转换为只有一层的数组。即：

[1, [2, [3, 4, 5], [7,8,[9],[10,11,12]]]] ==> [1, 2, 3,  4,  5, 7, 8, 9, 10, 11,12]

方法1：递归实现

通过循环递归的方式，一项一项地去遍历，如果每一项还是一个数组，那么就继续往下遍历，利用递归程序的方法，来实现数组的每一项的连接

let arr = [1, [2, [3, 4, 5], [7,8,[9],[10,11,12]]]];
function flatten(list) {
    let result = [];
    list.forEach(element => {
        if(!Array.isArray(element)) {
            result.push(element);
        }else{
            result = result.concat(flatten(element))
        }
    });
    return result;
}
console.log(flatten(arr)) // 输出：[1, 2, 3,  4,  5, 7, 8, 9, 10, 11,12]

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

方法2：reduce 函数迭代（重点记住）

let arr = [[1,6], [2, [3, 4, 5], [7,8,[9],[10,11,12]]]];
function flatten(arr) {
    return arr.reduce((prev, current, next) => {
        return prev.concat(Array.isArray(current)?flatten(current):current)
    },[])
}
console.log(flatten(arr))

方法3：扩展运算符

这个方法的实现，采用了扩展运算符和 some 的方法，两者共同使用，达到数组扁平化的目的；

var arr = [[1,6], [2, [3, 4, 5], [7,8,[9],[10,11,12]]]];
function flatten(arr) {
    while(arr.some(i => Array.isArray(i))) {
        arr = [].concat(...arr);
    }
    return arr;
}
console.log(flatten(arr))

方法4：split 和 toString 共同处理

将多维数组直接转换成逗号连接的字符串，然后再重新分隔成数组。

var arr = [[1,6], [2, [3, 4, 5], [7,8,[9],[10,11,12]]]];
function flatten(arr) {
   return arr.toString().split(",");
}
console.log(flatten(arr))

方法5：调用 ES6 中的 flat

可以直接调用 ES6 中的 flat 方法，可以直接实现数组扁平化；

arr.flat([depth])

其中 depth 是 flat 的参数，depth 是可以传递数组的展开深度（默认不填、数值是 1），即展开一层数组。编程过程中，发现对数组的嵌套层数不确定的时候，最好直接使用 Infinity，可以达到扁平化

var arr = [[1,6], [2, [3, 4, 5], [7,8,[9],[10,11,12]]]];
function flatten(arr) {
   return arr.flat(Infinity)
}
console.log(flatten(arr))

方法6：正则和 JSON 方法共同处理

用 JSON.stringify 的方法先转换为字符串，然后通过正则表达式过滤掉字符串中的数组的方括号，最后再利用 JSON.parse 把它转换成数组。

let arr = [[1,6], [2, [3, 4, 5], [7,8,[9],[10,11,12]]]];
function flatten(arr) {
  let str = JSON.stringify(arr);
  str = str.replace(/(\[|\])/g, '');
  str = '[' + str + ']';
  return JSON.parse(str); 
}
console.log(flatten(arr));

通过这个在线网站https://regexper.com/可以把正则分析成容易理解的可视化的逻辑脑图。

总结