函数currying

古城微笑少年丶 2023-01-18 13:23 5阅读 0赞

// 普通的add函数
    function add(x, y) {
        
        return x + y
    }
    
    // Currying后
    function curryingAdd(x) {
        
        return function (y) {
        
            return x + y
        }
    }
    
    add(1, 2)           // 3
    curryingAdd(1)(2)   // 3

实际上就是把add函数的x，y两个参数变成了先用一个函数接收x然后返回一个函数去处理y参数。现在思路应该就比较清晰了，就是只传递给函数一部分参数来调用它，让它返回一个函数去处理剩下的参数。

1.  参数复用

// 正常正则验证字符串 reg.test(txt)
    
    // 函数封装后
    function check(reg, txt) {
        
        return reg.test(txt)
    }
    
    check(/\d+/g, 'test')       //false
    check(/[a-z]+/g, 'test')    //true
    
    // Currying后
    function curryingCheck(reg) {
        
        return function(txt) {
        
            return reg.test(txt)
        }
    }
    
    var hasNumber = curryingCheck(/\d+/g)
    var hasLetter = curryingCheck(/[a-z]+/g)
    
    hasNumber('test1')      // true
    hasNumber('testtest')   // false
    hasLetter('21212')      // false

上面的示例是一个正则的校验，正常来说直接调用check函数就可以了，但是如果我有很多地方都要校验是否有数字，其实就是需要将第一个参数reg进行复用，这样别的地方就能够直接调用hasNumber，hasLetter等函数，让参数能够复用，调用起来也更方便。

我们在做项目的过程中，封装一些dom操作可以说再常见不过，上面第一种写法也是比较常见，但是我们看看第二种写法，它相对一第一种写法就是自执行然后返回一个新的函数，这样其实就是提前确定了会走哪一个方法，避免每次都进行判断。

1.  延迟运行

Function.prototype.bind = function (context) {
        
        var _this = this
        var args = Array.prototype.slice.call(arguments, 1)
     
        return function() {
        
            return _this.apply(context, args)
        }
    }