js实现类似于add(1)(2)(3)调用方式的方法

群里有人说实现类似add(1)(2)(3)调用方式的方法,结果马上有人回答:

var add = function(a){
    return function(b){
        return function(c){
            return a+b+c;
        };
    };
};

add(1)(2)(3); //6

没错!那要是add(1)(2)(3)(4) 这样4个调用呢,那这个肯定不适用了。

这种就是类似于执行一个函数返回函数自身值:

function add(x) {
    var sum = x;
    var tmp = function (y) {
        sum = sum + y;
        return tmp;
    };
    tmp.toString = function () {
        return sum;
    };
    return tmp;
}
console.log(add(1)(2)(3));  //6
console.log(add(1)(2)(3)(4));   //10

首先要一个数记住每次的计算值,所以使用了闭包,在tmp中记住了x的值,第一次调用add(),初始化了tmp,并将x保存在tmp的作用链中,然后返回tmp保证了第二次调用的是tmp函数,后面的计算都是在调用tmp, 因为tmp也是返回的自己,保证了第二次之后的调用也是调用tmp,而在tmp中将传入的参数与保存在作用链中x相加并付给sum,这样就保证了计算;

但是在计算完成后还是返回了tmp这个函数,这样就获取不到计算的结果了,我们需要的结果是一个计算的数字那么怎么办呢,首先要知道JavaScript中,打印和相加计算,会分别调用toString或valueOf函数,所以我们重写tmp的toString和valueOf方法,返回sum的值;

赞(0) 打赏
未经允许不得转载:WEB前端开发 » js实现类似于add(1)(2)(3)调用方式的方法

评论 5

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址
  1. #-49

    牛逼

    4年前 (2014-09-22)回复
  2. #-48

    没看懂QAQ
    可能是太笨

    ilia4年前 (2014-12-11)回复
  3. #-47

    function add(x){
    add.sum = (add.sum || 0) + x;
    add.toString = function(){return add.sum;};
    return add;
    }

    lux2年前 (2017-03-12)回复
  4. #-46

    这种方式叫curry化

    albarana1年前 (2017-07-25)回复
  5. #-45

    改写“toString”方法,为什么用的是“tmp.toString= function()”而不是“tmp.prototype.toString= function()”,两者(.toString和.prototype.toString)有什么区别吗?

    夺命奇犽1年前 (2017-10-17)回复

前端开发相关广告投放 更专业 更精准

联系我们

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

微信扫一扫打赏