对于前端项目开发过程中,偶尔会出现层叠数据结构的数组,我们需要将多层级数组转化为一级数组(即提取嵌套数组元素最终合并为一个数组),使其内容合并且展开。那么该如何去实现呢?

需求:多维数组=>一维数组

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

1. 调用ES6中的flat方法

  1. ary = arr.flat(Infinity);

2. replace + split

  1. ary = str.replace(/(\[|\])/g, '').split(',')

3. replace + JSON.parse

  1. str = str.replace(/(\[|\]))/g, '');
  2. str = '[' + str + ']';
  3. ary = JSON.parse(str);

4. 普通递归

  1. let result = [];
  2. let fn = function(ary) {
  3. for(let i = 0; i < ary.length; i++) {
  4. let item = ary[i];
  5. if (Array.isArray(ary[i])){
  6. fn(item);
  7. } else {
  8. result.push(item);
  9. }
  10. }
  11. }

5. 利用reduce函数迭代

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

6:扩展运算符

  1. //只要有一个元素有数组,那么循环继续
  2. while (arr.some(item => Array.isArray(item))) {
  3. arr = [].concat(...arr);
  4. }

这是一个比较实用而且很容易被问到的问题,欢迎大家交流补充。

more : Array.prototype.flat()—MDN