javascript 函数 add(1)(2)(3)(4)实现无限极累加 —— 一步一步原理解析

问题：我们有一个需求，用js 实现一个无限极累加的函数， 形如 add(1) //=> 1; add(1)(2)  //=> 2; add(1)(2)(3) //=>  6; add(1)(2)(3)(4) //=> 10; 以此类推。。。。。

乍一看很神奇， 下面我将一步一步实现一个这样的 add()函数。

第一步：首先，  我们要了解一个知识点： 函数的 toString()方法当我们直接alert() 一个函数的时候会被调用（或者 用 console.log() 打印一个函数的时候会被调用）。

举一个例子：

function s(a){
    return  a+1;
}
alert(s);

　　

第二步：好的，我们现在对函数 s 定义一个 toSting() 方法

function s(a){
    return  a+1;
}
s.toString = function(){return 2;}
console.log(s);
typeof(s)

　　

定义了s.toString 方法后， 直接console.log(s) 的话，会打印出这个函数， 如果直接 alert(s)的话，我们可以看到会弹出 “2”， 我们检测一下s 的类型（typeof(s)）,

显然 s 是一个函数。

第三步：好的，现在我们来给这个  s  函数包裹上一层"外套"  -:)

function add(a){
 function s(a){
    return  a+1;
 }
 s.toString = function(){return a;}
 return s;
}
console.log(add(3));
 

　　

在上面的代码中，我们给之前的代码 包裹了一层，并且也修改了一下s.toSting() 方法，让它返回的是外面传递进来的参数a, 而不是之前固定的2。
包裹了一层后，返回值为一个函数，这样就形成了一个闭包。 这样，我们在调用 add(3) 的时候，返回值其实是一个函数， 里面的 s 这个函数。

但是，当我们 alert(s(3)) 的时候， 会弹出  3 。

第四步：好的，下面是最后一步，“见证奇迹的时刻到了”————

function add(a){
 function s(b){
    a =   a+b;
    return s;
 }
 s.toString = function(){return a;}
 return s;
}
console.log(add(1)(2)(3)(4));

 

　　

到这里，我们可以看到，上面 console.log(add(1)(2)(3)(4)); 这句话打印出 一个函数，  function 10  , 其实就是当 alert(add(1)(2)(3)(4));的时候，会弹出 10.
这就是 add(1)(2)(3)(4); 的实现过程，显然，我们这个累加函数是可以无限调用的 。-:) 小开心一下哈

 

下面，我来谈一谈个人的思路和理解，还望大家能踊跃参数， 帮忙指点我一下，不甚感激！

我觉得：整个实现过程就是两个关键点。
1. 使用闭包， 同时要对JavaScript 的作用域链（原型链）有深入的理解；

2. 重写函数的 toSting()方法；

好的，对add(1)(2)(3); 一步一步分析： 

a) 执行add(1);   

　　　　　　返回的是里面的  s  函数， 通过闭包，s 函数里面可以访问到 变量 a=1;  所以 当我们 alert(add(1)); 的时候， 调用的 toSting（）方法会将作用域（原型链）里面的 a = 1 弹出来。

b) 执行add(1)(2);

　　　　　　<===等价于===> s(2);  这里面相当于 把 2 传递给 s()函数里面的 b , 让作用域（原型链）里面的 a = a+b ,此时 a = 3， 继续保存在作用域中了。 然后还是返回 s 函数。


c) 执行 add(1)(2)(3); 

　　　　　　<===等价于===> s(3);和上面 b) 中的分析一样，只是更新了作用域中的 a = 6 了，然后同样是返回 s 函数。