JavaScript 如何数组扁平化(6种实现方法)

数组扁平化：就是将多层级数组转化为一级数组（即提取嵌套数组元素最终合并为一个数组），使其内容合并且展开。

下面是Lodash封装的数组扁平化API flattenDeep

_.flattenDeep([1, [2, [3, [4]], 5]]);
// => [1, 2, 3, 4, 5]

明确需求：多维数组 => 一维数组

let ary = [1, [2, [3, [4, 5]]], 6];// -> [1, 2, 3, 4, 5, 6]
let str = JSON.stringify(ary);

1. 调用ES6中的flat方法

// 默认为1，如果不管有多少层嵌套，都要转成一维数组，可以用Infinity关键字作为参数
ary = ary.flat(Infinity);
console.log(arr) // => [1, 2, 3, 4, 5, 6]

2. replace + split(字符串数组)

ary = str.replace(/(\[|\])/g, '').split(',')
console.log(arr) // => ["1", "2", "3", "4", "5", "6"]

3. replace + JSON.parse

str = str.replace(/(\[|\])/g, '');
str = '[' + str + ']';
ary = JSON.parse(str);
console.log(arr) // => [1, 2, 3, 4, 5, 6]

4. 普通递归

let result = [];
let fn = function(ary) {
  for(let i = 0; i < ary.length; i++) {
    let item = ary[i];
    if (Array.isArray(ary[i])){
      fn(item);
    } else {
      result.push(item);
    }
  }
}

5. 利用reduce函数迭代

function flatten(ary) {
    return ary.reduce((pre, cur) => {
        return pre.concat(Array.isArray(cur) ? flatten(cur) : cur);
    }, []);
}
let ary = [1, 2, [3, 4], [5, [6, 7]]]
console.log(flatten(ary))

6. 扩展运算符

//只要有一个元素有数组，那么循环继续
while (ary.some(Array.isArray)) {
  ary = [].concat(...ary);
}