关于javascript:大厂面试题手写数组的Flat方法

前一阵面试大厂的前端岗，让手撸数组的Flat办法,很遗憾过后太菜没有什么思路，面试后仔细分析了一下，发现这道算法题齐全没有设想中的那么难，确实是一套纯根底题，应用数组的reduce联合递归能够很轻松的实现，这里简略介绍下实现思路，以飨读者！

前置常识

数组的flat办法：

Flat()俗称把数组拍平的办法。
应用flat办法时能够传递一个数字，代表拍平嵌套数组的层数，不传值的话则为默认值1。如果咱们传递的参数为Infinity，则会将所有嵌套数组拍平。如果数组中有空元素，则拍平后的数组也不蕴含空元素

let arr1 = [1, 2, [3, 4]];
arr1.flat();
// [1, 2, 3, 4]

let arr2 = [1, 2, [3, 4, [5, 6]]];
arr2.flat();
// [1, 2, 3, 4, [5, 6]]

let arr3 = [1, 2, [3, 4, [5, 6]]];
arr3.flat(2);
// [1, 2, 3, 4, 5, 6]


//应用 Infinity，可开展任意深度的嵌套数组
let arr4 = [1, 2, [3, 4, [5, 6, [7, 8, [9, 10]]]]];
arr4.flat(Infinity);
// [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]

//flat会移除数组中的空项
let arr5 =[1,2,3,,5,[6,7]]
console.log(arr5.flat())
//[1, 2, 3, 5, 6, 7]

数组的Reduce办法：

第一次接触到Reduce是在学习Hadoop的时候，那时候的了解是对Map后的数据各自执行Reduce解决，而后将处理结果汇总返回。JS中的Reduce与这个概念相似，就是通过一个办法对数组中的元素逐个解决，而后将后果逐个叠加，最初将后果返回进来。比方咱们想要对数组中的元素执行平方后求和，用Reduce就很容易实现，代码如下：

let arr6=[1,2,3];
console.log(arr6.reduce((prev,curr)=>prev+curr*curr,0));

猛一看确实让人有点费解，大可不必。想要搞清楚reduce的应用形式第一步要搞清楚reduce传递的参数，为如下四个：

在TS中，对Reduce办法定义的类型如下：

reduce(callbackfn: (previousValue: T, currentValue: T, currentIndex: number, array: T[]) => T): T;

reduce(callbackfn: (previousValue: T, currentValue: T, currentIndex: number, array: T[]) => T, initialValue: T): T;

咱们能够看到，这里TS定义的reduce数据类型有两种调用形式，一种为蕴含初始值的调用形式，一种是不提供初始值的调用形式，这两种有什么区别？这里咱们不卖关子，间接看例子：

let arr6=[2,2,3]
console.log(arr6.reduce((prev,curr,index)=>{
    console.log(index)
    return prev+curr*curr
}))
//输入为：1 2     15

let arr6=[2,2,3]
console.log(arr6.reduce((prev,curr,index)=>{
    console.log(index)
    return prev+curr*curr
},0))
//输入为: 0 1 2      17

能够分明地看到，提供initialValue后，reduce会从index为0的元素开始执行回调办法，而不提供initialValue则会将跳过index为0的元素，间接从index为1的元素开始执行回调办法（行将index为0的元素设置为initialValue）。

算法实现

1.应用reduce办法实现提取深度为1的数组

function MyFlat(arr){
    return arr.reduce((prev,curr)=>prev.concat(curr),[]);
}

let arr=[1,2,3,4,5,6,[7,8,9]];
console.log(MyFlat(arr));
//[1, 2, 3, 4, 5, 6, 7, 8, 9]

2.应用数组的解构赋值实现提取深度为1的数组

function MyFlat(arr){
    return [].concat(...arr)
}

let arr=[1,2,3,4,5,6,[7,8,9]]
console.log(MyFlat(arr))

ps：这个办法有点炫^_^

3.应用reduce+递归实现多层数组的提取

后面两个实现的是不传参的flat办法，也即是对数组执行层级为1的提取。如果咱们想指定提取的层级，或者应用Infinity提取任意层数组怎么做呢？看代码：

function MyFlat(arr,deep=1){
    return deep>0 ? arr.reduce((prev,curr)=>prev.concat(Array.isArray(curr)?MyFlat(curr,deep-1):curr),[]):arr.slice()
}
console.log(MyFlat([1,2,3,[4,5,[6,7,8,[9,10]]]],Infinity))
//[1, 2, 3, 4, 5, 6, 7, 8, 9, 10]

代码很短，然而很有嚼头。咱们在参数里减少了一个变量deep代表默认深度，给他一个默认值1。程序会首先判断deep的深度，如果深度大于零就执行前面的代码，否则返回数组的正本。
如果深度大于0，咱们会用initialValue也就是空数组去concat数组外面的元素，在concat的时候咱们会判断以后元素是否为数组，如果是数组则递归执行MyFlat办法对子元素进行提取。这里不要忘了，咱们提供了初始值”[]”，所以其会从index为0的元素开始执行回调办法。

3.应用生成器函数实现多层数组的提取

待续……