1、递归遍历

const a = [1, 2, [3, 4, [5, 6, [7]]]];

const flatten = (arr) => {
  let resultArr = [];
  arr.forEach((item) => {
    if (Array.isArray(item)) {
      resultArr = resultArr.concat(flatten(item));
    } else {
      resultArr.push(item);
    }
  });
  return resultArr;
};

2、利用reduce函数迭代

const a = [1, 2, [3, 4, [5, 6, [7]]]];
const flatten = (arr) => {
  return arr.reduce((prve, next) => {
    return prve.concat(Array.isArray(next) ? flatten(next) : next);
  }, []);
};
console.log(flatten(a));

3、扩展运算符实现

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

4、split 和 toString 共同处理

const a = [1, 2, [3, 4, [5, 6, [7]]]];
const flatten = (arr) => {
  return arr.toString().split(",");
};
console.log(flatten(a));

5、调用 ES6 中的 flat

先来看下 flat 方法的语法:

arr.flat([depth])

其中 depth是 flat的参数,depth是可以传递数组的展开深度(默认不填、数值是 1),即展开一层数组。那么如果多层的该怎么处理呢?参数也可以传进 Infinity,代表不论多少层都要展开。那么我们来看下,用 flat方法怎么实现,请看下面的代码。

const a = [1, [2, [3, [4, 5]]]];
const flatten = (arr) => {
  return arr.flat(Infinity);
};
console.log(flatten(a));

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

const flatten = (arr) => {
  let str = JSON.stringify(arr);
  str = str.replace(/(\[|\])/g,'');
  str = `[${str}]`;
  return JSON.parse(str);
};
console.log(flatten(a));