1、函数柯里化

上面的api用的很多，所以都知道是干嘛的使用场景是什么，柯里化用得并不多，所以想手撕之前还是先了解一下它的意义以及用处

什么是柯里化

柯里化Currying又称部分求值，是高阶函数的一种，通常只需要把一部分参数传递给函数，函数会返回一个新的函数去接受并处理新的参数，也就是分批次处理参数。这会出现一个什么情况呢？就是函数的调用会非常灵活，并且复用性增强

一个简单的柯里化函数如下：

 const curry = (a)=>(b)=>(c)=>{
     console.log(a+b+c)
 }
 curry(1)        // 不会得到计算结果
 curry(1)(2)(3)  // 6

从上面的例子可以看出，柯里化想要实现的是：分批次接受参数，当参数数量达到要求时执行原函数，否则返回新的函数，这个新的函数会携带原函数和已经传入的参数并返回新的柯里化函数，去接受剩下的参数。依此类推，直到传入的参数数量达到柯里化函数的需求，就会执行原函数

有了这个思路，实现柯里化就比较清晰了

手写函数柯里化

 /*
 * @param {Function} fn 需要执行的原函数
 * @param {*} getArgs1 上次获取的参数列表
 * @param {*} getArgs2 本次传入的参数列表
 **/
 const myCurry = (fn, ...getArgs1) => {
     return (...getArgs2) => {
         // 闭包
         const _args = [...getArgs1, ...getArgs2]
         // 当多次传入的参数总数达标, 则执行原函数
         // 通过fn.length得到原函数需要的参数的数目
         if(_args.length >= fn.length0){
             return fn.call(this, ..._args)
         }else{
             // 否则返回新的柯里化函数去接受剩余参数
             return myCurry.call(this, fn, ..._args)
         }
     }
 }

测试结果

可以看到，柯里化的实现需要用到闭包

2、数组去重

Set

 function getUnRepeatArr(arr){
     return [...new Set(arr)]
 }

filter

 function getUnRepeatArr(arr){
     return arr.filter((item, index) => {
         // 过滤的方法，如果说数组中最后一个元素的索引===当前遍历到的元素的索引
         // 那么我们认为它是唯一的
         return arr.lastIndexOf(item) === index
     })
 }

3、sleep

 function sleep(fn, wait=3*1000) {
     return new Promise((resolve, reject) => {
         setTimeout(() => {
             resolve(fn && fn())
         }, wait)
     })
 }

4、浅拷贝

Object.assign

ES6提供的方法，接收多个参数，第一个参数是目标对象，后面的参数是源对象 ，这个API将源对象复制到目标对象上，但是注意：

• 若源对象和目标对象有同名属性，目标对象中的会被覆盖
• 如果该函数只有一个参数，当参数为对象时，直接返回该对象；当参数不是对象时，会先将参数转为对象然后返回。
• 因为null 和 undefined 不能转化为对象，所以第一个参数不能为null或 undefined，会报错。

 let target = { a: 1 }
 let source1 = { b: 2 }
 let source2 = { c: 3 }
 Object.assign(target, source1, source2)

扩展运算符

顾名思义：

 let copyArr = [...arr]
 // 或者
 let copyObj = {...obj}

数组方法

slice()

这个方法用于切割数组并返回切割结果的浅拷贝，如果两个参数都不写，那么就是返回整个数组的浅拷贝

 let arr = [1,2,3]
 console.log(arr.slice() === arr) // false

concat

用于合并多个数组并返回新数组，不传参也是浅拷贝

 let arr = [1,2,3]
 console.log(arr.concat() === arr)  //false

手写

 function shallowCopy(obj) {
     if(!obj || typeof obj == 'undefined') return;
     // 看看是数组还是obj
     let copy = Array.isArray(obj) ? [] : {}
     
     // 
     for(let key in obj){
         if(obj.hasOwnProperty(key)){
             copy[key] = obj[key]
         }
     }
     
     return copy
 }

5、深拷贝

JSON.parse(JSON.stringify(obj))

项目中较常用，但有缺陷，无法处理undefined、Symbol、Function

lodash的__.cloneDeel()

 const _ = require('lodash')
 let obj = { a: 1, b: [1,2,3] }
 let deepClone = _.cloneDeep(obj)

手写

利用递归实现

 function deepClone(obj) {
     if(!obj || typeof obj === 'undefined') return;
     
     let deepCopy = Array.isArray(obj) ? [] : {}
     
     for(let key in obj) {
         if(obj.hasOwnProperty(key)) {
             deepCopy[key] = typeof obj[key] === 'object' ? deepClone(obj[key]) : obj[key]
         }
     }
     return deepCopy
 }

6、数组扁平化

生成器函数

 function* flatten(arr) {
     for(let item of arr){
         if(Array.isArray(item)){
             yield* flatten(item) // 抛给另一个生成器函数，形成递归
         }else{
             yield item
         }
     }
 }

递归concat

这个方法就是挨个挨个把嵌套的数组拿出来浅拷贝到输出数组里

 function faltten(arr) {
   var res = []
   var out = []
 ​
   res = res.concat(arr)
   while (res.length) {
     var fir = res.shift()
     if (fir.children.length) {
       res = res.concat(fir.children)
     }
     out.push(fir)
   }
 ​
   return out
 }

reduce迭代

 function flatten(arr) {
     return arr.reduce(function(prev, next){
         return prev.concat(Array.isArray(next) ? flatten(next) : next)
     }, [])
 }

split + toString

 function flatten(arr) {
     return arr.toString().split(',').map(n => Number(n))
 }

ES6 - flat

利用ES6提供的flat方法，接受一个参数，指定扁平化的层级，Infinity为彻底扁平化

 function flatten(arr) {
     return arr.flat(Infinity)
 }