数组的扁平化处理方法

Posted 2020-11-01 我的故事没编好

在数组的操作中经常会遇到数组嵌套数组的情况，而我们常常需要的是单层数组。

也就是[1,2,[3,4,[5,[6,[7]]]]] ===》[ 1, 2, 3, 4, 5, 6, 7 ] ，我们称之为数组的扁平化处理。

方法一

如果是纯数字的数组（试了一下字符串的也可以）可以利用简单的toString和split方法

var arr = [1,‘a‘,[3,‘4‘,[‘b‘,[6,[7]]]]]
console.log(arr.toString().split(‘,‘))
//[ ‘1‘, ‘a‘, ‘3‘, ‘4‘, ‘b‘, ‘6‘, ‘7‘ ]

方法二

使用递归方法，如果元素还是数组则继续调用

var arr = [1,‘a‘,[3,‘4‘,[‘b‘,[6,[7]]]]];

function flatten(arr) {
  let res = [];
  for (let i=0,len=arr.length;i<len;i++) {
    if(Array.isArray(arr[i])) {
      res = res.concat(flatten(arr[i]));
    }else{
      res.push(arr[i])
    }
  }
  return res;
}
console.log(flatten(arr))
//[ 1, ‘a‘, 3, ‘4‘, ‘b‘, 6, 7 ]

上面代码可以通过array的reduce方法来实现简化

var arr = [[1,[2]],‘a‘,[3,‘4‘,[‘b‘,[6,[7]]]]]

function flatten(arr) {
  return arr.reduce((prev,item) => {
    return prev.concat(Array.isArray(item)?flatten(item):item);
  }, []);
}
console.log(flatten(arr))
//[ 1, 2, ‘a‘, 3, ‘4‘, ‘b‘, 6, 7 ]

reduce方法和reduceRight方法都会迭代数组所有项，然后构建一个最终返回值。第一个方法正向遍历，第二个反向遍历。

都接受两个参数，第一个是每一项要执行的函数，第二个是可选参数作为归并基础的初始值。函数接收4个参数：前一个值、当前值、项的索引、数组对象。

再化简

var arr = [[1,[2]],‘a‘,[3,‘4‘,[‘b‘,[6,[7]]]]];
const Flat6 = arr => arr.reduce((a, b) => a.concat(Array.isArray(b) ? Flat6(b) : b), []); 
console.log(Flat6(arr))
//[ 1, 2, ‘a‘, 3, ‘4‘, ‘b‘, 6, 7 ]

 

方法三

如果确定是简单的双层嵌套数组可以使用es6提供的扩展运算符

var arr = [[1,2],[3],[4,5,6]]
console.log([].concat(...arr))
//[ 1, 2, 3, 4, 5, 6 ]

发现还有更好的方法了再添加吧~~~