答复: [原创]ExtJS 2.3源码分析（2012年02月21日更新）

 

临时详解下下面的代码：

    // 这个函数可以在你执行完原函数以后，执行一下自定义的函数。  
          createSequence : function( fcn , scope ) {  
              if ( typeof fcn != "function" ) {  
                  return this;  
              }  
              var method = this;  
              return function() {  
                  var retval = method.apply( this || window , arguments );  
                  fcn.apply( scope || this || window , arguments );  
                  return retval;  
              };  
          }  

 

 这个代码为什么要这么设计呢？

先看API中关于这个方法的使用方法：

    var sayHi = function(name){    alert('Hi, ' + name);}  
    sayHi('Fred'); // alerts "Hi, Fred"  
    var sayGoodbye = sayHi.createSequence(function(name){     
                                               alert('Bye, ' + name);  
                                       });  
    sayGoodbye('Fred'); // both alerts show

 

最终createSequence需要返回一个function类型的方法所以在方法的定义中return 了一个function。

且根据方法定义，该方法的第一个参数必须是一个function类型的对象，所以在方法的最开始首先判断该方法第一个参数的参数类型若不为 function则放弃后续操作并将createSequence方法的调用者返回去。这样类似于var sayGoodbye = sayHi.createSequence({});在执行sayGoodbye();时等价于调用sayHi();

 

这里还有一个待解决的问题那就是如何将sayHi保存起来，因为根据createSequence的定义。该方法需要先调用sayHi()而后调用里面的那个匿名function。

且因为一定要返回一个function所以下面必须renturn function（）{。。。。。}这里请注意一点，返回的function中的this和return外面的this并不是同一个对象。

我们看代码：var mathod = this; 返回的function中： var retval = method.apply( this || window , arguments );

这2个this是不一样的，return外面的this表示调用createSequence的对象，根据上面的例子就是sayHi这个function。而return中的this代表调用return的function的那个对象，也就是调用sayHi的那个对象 而不是sayHi本身 。

所以必须在return function之前先把代表sayHi的function也就是那个this用一个内部变量缓存起来利用闭包供return的function执行时使用。

所以才有了var retval = method.apply( this || window , arguments );的写法。根据上面的DEMO我们重新给方法定义添加一些注释以帮助理解2个不同的this：

    // 这个函数可以在你执行完原函数以后，执行一下自定义的函数。  
          createSequence : function( fcn , scope ) {  
                    //这里的fcn就是DEMO中的那个<strong>function</strong>(name){alert(<em>'Bye, '</em> + name);}  
      
                      if ( typeof fcn != "function" ) {  
                  return this;  
              }  
              var method = this;//这个this为sayHi (类型为function)  
              return function() {  
                  var retval = method.apply( this || window , arguments );//这个this为调用sayHi的对象也就是window  
                             //上面那一句相当于调用sayHi(/* 这个地方应该是arguments 也就是 'Fred' */);  
                               fcn.apply( scope || this || window , arguments );
                          //上一句相当于执行function(name){alert('Bye, ' + name);}('Fred')  
                  return retval;//根据定义返回sayHi执行结果  
              };  
          }