一篇文章带你弄懂js柯里化

72 阅读1分钟

一、什么是柯里化(Currying)

它将接受多个参数的函数转换为一个接受单一参数的函数,原始的函数在接收到足够数量的参数之前,会一直返回新的函数,直到所有函数都被传递为止。(一直return到知道最后一个函数return结束)

简单的柯里化案例

//柯里化前的函数
function add(x,y,z) {
    return x + y + z;
}

//柯里化函数
function curryAdd(x) {
    return function(y){
        return function(z){
            return x + y + z;
        }
    }
}
//调用柯里化函数
const a = curryAdd(10)
//此时a赋值为function (y){return function(z){return x + y + z}
const b = a(5)
console.log(b(15));//输出30

二、柯里化使用场景

1.参数复用(个人觉得这个用的比较多,也比较好用)

案例
//需求:网站协议和其他不同地址进行组合
//以前的代码
function website(head,url) {
    return head + url
}
console.log(website('https://','juejin.cn'))
console.log(website('https://','www.baidu.com'))
console.log(website('https://','www.google.com'))
//柯里化后的代码
function curryWebsite(a) {
    return function url(b) {
        return a + b;
    }
}
const url_http = curryWebsite('https://')
// 利用这样传值进行柯里化函数
console.log(url_http('juejin.cn')
console.log(url_http('www.baidu.com')
console.log(url_http('www.google.com')

2.延时执行

案例(也是一道面试题)
//使以下函数结果成立
// curryAdd(1)(2)(3) = 6
// curryAdd(1,2,3)(4) = 10
// curryAdd(1)(2)(3)(4)(5) = 15
function curryAdd() {
    //把arguments转换为数组,[不懂得看这里](https://www.cnblogs.com/dreamone/p/7448659.html)
    let args = Array.prototype.slice.call(arguments)
    //递归调用inner
    let inner = function () {
    args.push(...arguments)
          return inner
    }
    //修改原型上的toString方法
    inner.toString = function () {
        return args.reduce((prev, cur) => {
            return prev + cur
        })
    }
    return inner
 }
 //此处.toString()分浏览器,由于会隐式转换的原因,有的浏览器可以显示有的不显示,
console.log(curryAdd(1)(2)(3).toString())//结果:6

文中如有错误,欢迎在评论区指正,如果这篇文章帮到了你,欢迎点赞♥和关注♥