一、概念

数组扁平化就是将一个多维数组转换为一个一维数组，如下 [1,[2,[3,4,5]]] ==> [1,2,3,4,5]

二、实现方式

1、最简便的ES6的flat方法

  let arr=[1,2,[3,[4,[5,6]]]]
  //  方式一：flat中的参数代表深度
  console.log(arr.flat(3));
  // //如果我们不知道数组有多少层
  console.log(arr.flat(Infinity));

2、用字符串来过渡

  function f(arr){
    arr.join().split(',').map((item)=>{
      return parseInt(item)
    });
  }
  f(arr)

arr为数组，join合成字符串，split分成数组，此时数组里面的项还是字符串形式，再用parseInt转成数字

3、concat拼接

function flat(arr) {
      while (arr.some(item => Array.isArray(item))) {
        arr = [].concat(...arr);

      }
      return arr;
    }
console.log(flat(arr));

4、递归

let arr = [1, [2, [3, 4, 5]]];
function flatten(arr) {
  let result = [];

  for(let i = 0; i < arr.length; i++) {
    if(Array.isArray(arr[i])) {
      result = result.concat(flatten(arr[i]));
    } else {
      result.push(arr[i]);
    }
  }
  return result;
}
console.log(flatten(arr));  //  [1, 2, 3, 4，5]

5、Reduce()

let arr = [1, [2, [3, 4]]];
function flatten(arr) {
    return arr.reduce(function(prev, next){
        return prev.concat(Array.isArray(next) ? flatten(next) : next)
    }, [])
}
console.log(flatten(arr));//  [1, 2, 3, 4，5]

三、Reduce()是啥

一个完整的reduce方法应该是这样：

array.reduce(function(accumulator, currentValue, currentIndex, array), initialValue)

例1

let arr = ['e', 'l', 'l', 'o'];
arr.reduce((accumulator, currentValue, currentIndex, array) => {
    console.log(accumulator, currentValue, currentIndex, array);
});

例1结果

图片.png 为什么 accumulator第一次循环是e，后续循环怎么都是undefined了？

没有给reduce提供初始值，所以第一次循环数组的第一项作为了reduce方法的初始值，后续循环中由于没 return操作，导致accumulator拿不到上次返回值，所以就是undefined了。

我们在console后面加上return操作：

```
let arr = ['e', 'l', 'l', 'o'];
arr.reduce((accumulator, currentValue, currentIndex, array) => {
    console.log(accumulator, currentValue, currentIndex, array);
    return accumulator+currentValue;
});
```

图片.png

那也不对啊，我数组明明有四项，照输出来看reduce方法怎么只执行了三次？

这是因为我们没提供初始值 initialValue ，导致reduce方法将数组的第一项作为了初始值，所以循环第一次是从数组第二项开始的，我们尝试给reduce添加一个默认值并且把console语句往后放一句（这样展示的才最后一步reduce操作完的结果）：

let arr = ['e', 'l', 'l', 'o'];
let result = arr.reduce((accumulator, currentValue, currentIndex, array) => {
    return accumulator+currentValue;
},'h');
console.log(result);//hello

over

推荐原文1 原文2

数组扁平化andReduce( )方法 | 青训营笔记