🎉 前言

柯里化简单来说就是将一个多参数的函数转化为但参数的函数的过程。它是指将一个函数从可调用的 f(a, b, c) 转换为可调用的 f(a)(b)(c)。

柯里化不会调用函数。它只是对函数进行转换。简单的案例展示：

function plus(x, y){
    return x + y
}
 
plus(1, 2) // 输出 3

//这是一个最简单的抓换，帮助理解什么是柯里化的定义
function plus(y){
    return function (x){
        return x + y
    }
}
 
plus(1)(2) // 输出 3

🎉 深入剖析

以下我们将利用柯里化的价格应用场景来进行介绍柯里化。

🎇 参数复用

参数复用是将在一个函数中，经常使用的参数进行提取，这样就可以减少代码量。

function uri(pro,host,path){
    return `${pro}${host}${path}`
}
const uri1 = uri('http://','www.baidu.com','/dir')
console.log(uri1)
//输出(https://www.baidu.com/dir)

柯里化之后

当时当我们经常使用这个方法的时候，就会看到(pro)是经常使用的参数那我我么你就可以进行改进
因为作用域链的关系里边的函数可以使用pro这个参数，是闭包的应用

function uri_curring(pro){
    return function(host,path){
        return `${pro}${host}${path}`
    }
}
const uri_https  = uri_curring('http://')
const uri2 = uri_https('www.baidu.com','/dir')
const uri3 = uri_https('www.pinyougou.com','/dir')
const uri4 = uri_https('www.taobao.com','/dir')

🎇 兼容性检测

addEventListener 和attachEvent 可以使用柯里化的函数通过一个函数来进行多个函数的判断。

//这里使用了立即执行函数，以及call保证当前的调用的this指向
 const whichEvent = (function(){
     if(window.addEventListener){
         return function(elemnt, type, listener, useCapture){
             elemnt.addEventListener(type,function(e){
                 listener.call(elemnt,e)
             },useCapture)
         }
     }else if(window.attachEvent){
         return function(elemnt, type,handler){
             elemnt.attachEvent('on'+type,function(e){
                 handler.call(elemnt,e)
             })
         }
     }
 })()

🎇 延迟执行

延迟执行,设计一个函数可以实现下面的函数操作

add(1)(2)(3) =6
add(1,2,3)(4) = 10
add(1)(2)(3)(4)(5) = 15

function add(){
    //将arguments的伪数组转化为真正的数组
    ler args = Array.prototype.slice.call(argments)
    let inner = function (){
        //当函数在词执行时就会将第二次的arguments传入到args中  add(1) 和add(1)(2)
        args.push(...argments)
        //在这里返回inner的时候调用的是toString方法，并且将这个函数转化为了一个字符串
        return inner
    }
    inner.toString=function(){
        //改写该方法，将其结果进行返回
        return args.reduce(function(pre,cur)=>{
            return pre + cur
        })
    }
    //返回一个函数
    return inner
}

🎇 含有柯里化的箭头函数

const nameList= [
    {mid:'妖姬',profession:'中单'},
    {mid:'蛇女',profession:'中单'},
    {mid:'沙皇',profession:'中单'},
    {mid:'发条',profession:'中单'}
    ]
//这就是一个箭头函数的柯里化函数
//将两个箭头函数进行拆解就可以看出其中element用到了前一个箭头函数的name变量，这就是一个柯里化的函数
const curring = name=>elemnt=>elemnt[name]
const name_mid = curring('mid')
nameList.map(name_mid)

🎉 总结

柯里化是一种转换，将 f(a,b,c) 转换为可以被以 f(a)(b)(c) 的形式进行调用。JavaScript 实现通常都保持该函数可以被正常调用，并且如果参数数量不足，则返回偏函数。

柯里化让我们能够更容易地获取偏函数。普通函数 log(date, importance, message) 在被柯里化之后，当我们调用它的时候传入一个参数（如 log(date)）或两个参数（log(date, importance)）时，它会返回偏函数。

这里有偏函数的文章欧：

面试之--函数柯里化