javascript 中caller,callee,call,apply 的概念[轉載]

在提到上述的概念以前，首先想說說javascript中函數的隱含參數：arguments

Arguments ：  

該對象表明正在執行的函數和調用它的函數的參數。

[function.]arguments[n] 參數function ：選項。當前正在執行的 Function 對象的名字。 
n ：選項, 要傳遞給 Function 對象的從0開始的參數值索引。 
說明Arguments ：是進行函數調用時，除了指定的參數外，還另外建立的一個隱藏對象。Arguments是一個相似數組但不是數組的對象，說它相似數組是由於其具備數組同樣的訪問性質及方式，能夠由arguments[n]來訪問對應的單個參數的值，並擁有數組長度屬性length。還有就是arguments對象存儲的是實際傳遞給函數的參數，而不侷限於函數聲明所定義的參數列表，並且不能顯式建立 arguments 對象。arguments 對象只有函數開始時纔可用。下邊例子詳細說明了這些性質://arguments 對象的用法。 

在此添加了一個說明arguments不是數組(Array類)的代碼:
//arguments 對象的用法。

 1 function ArgTest(a, b){
 2     var i, s = "The ArgTest function expected ";
 3     var numargs = arguments.length;      // 獲取被傳遞參數的數值。
 4     var expargs = ArgTest.length;        // 獲取指望參數的數值。
 5     if (expargs < 2)
 6        s += expargs + " argument. ";
 7     else
 8        s += expargs + " arguments. ";
 9     if (numargs < 2)
10        s += numargs + " was passed.";
11     else
12        s += numargs + " were passed.";
13     s += "\n\n"
14     for (i =0 ; i < numargs; i++){       // 獲取參數內容。
15     s += "   Arg " + i + " = " + arguments[i] + "\n";
16     }
17     return(s);                           // 返回參數列表。
18 } 

在此添加了一個說明arguments不是數組(Array類)的代碼:

1 Array.prototype.selfvalue = 1;
2 alert(new Array().selfvalue);
3 function testAguments(){
4      alert(arguments.selfvalue);
5 }

   
  運行代碼你會發現第一個alert顯示1，這表示數組對象擁有selfvalue屬性，值爲1，而當你調用函數testAguments時，你會發現顯示的是「undefined」，說明了不是arguments的屬性，即arguments並非一個數組對象。

 caller：

   返回一個對函數的引用，該函數調用了當前函數。
   functionName.caller 
   functionName 對象是所執行函數的名稱。
  說明
       對於函數來講，caller 屬性只有在函數執行時纔有定義。若是函數是由頂層調用的，那麼 caller 包含的就是 null 。若是在字符串上下文中使用 caller 屬性，那麼結果和 functionName.toString 同樣，也就是說，顯示的是函數

       的反編譯文本。 下面的例子說明了 caller 屬性的用法：

 1 // caller demo {
 2 function callerDemo() {
 3      if (callerDemo.caller) {
 4          var a= callerDemo.caller.toString();
 5          alert(a);
 6      } else {
 7          alert("this is a top function");
 8      }
 9 }
10 function handleCaller() {
11      callerDemo();
12 }

 

callee ：

     返回正被執行的 Function 對象，也就是所指定的 Function 對象的正文。

     [function.]arguments.callee
          可選項 function 參數是當前正在執行的 Function 對象的名稱。

     說明 ： callee 屬性的初始值就是正被執行的 Function 對象。

    callee 屬性是 arguments 對象的一個成員，它表示對函數對象自己的引用，這有利於匿名函數的遞歸或者保證函數的封裝性，例以下邊示例的遞歸計算1到n的天然數之和。而該屬性僅當相關函數正在執行時纔可用。還有須要注意的是callee擁有length屬性，這個屬性有時候用於驗證仍是比較好的。arguments.length是實參長度，arguments.callee.length是
    形參長度，由此能夠判斷調用時形參長度是否和實參長度一致。

   示例

1 //callee能夠打印其自己
2 function calleeDemo() {
3    alert(arguments.callee);
4 }  

 

 1 //用於驗證參數
 2 function calleeLengthDemo(arg1, arg2) {
 3      if (arguments.length==arguments.callee.length) {
 4          window.alert("驗證形參和實參長度正確！");
 5          return;
 6      } else {
 7          alert("實參長度：" +arguments.length);
 8          alert("形參長度： " +arguments.callee.length);
 9      }
10 }
11 //遞歸計算
12 var sum = function(n){
13    if (n <= 0)                        
14    return 1;
15    else
16      return n ＋arguments.callee(n - 1)
17 }
18 比較通常的遞歸函數：
19 
20 var sum = function(n){
21      if (1==n) return 1;
22 else return n + sum (n-1);

調用時：alert(sum(100));
其中函數內部包含了對sum自身的引用，函數名僅僅是一個變量名，在函數內部調用sum即至關於調用
一個全局變量，不能很好的體現出是調用自身，這時使用callee會是一個比較好的方法。

apply and call  ：

   它們的做用都是將函數綁定到另一個對象上去運行，二者僅在定義參數方式有所區別：

     apply( thisArg , argArray );  call( thisArg[,arg1,arg2…] ] );

    即全部函數內部的this指針都會被賦值爲 thisArg，這可實現將函數做爲另一個對象的方法運行的目的

    apply的說明：

    若是 argArray 不是一個有效的數組或者不是 arguments 對象，那麼將致使一個 TypeError。若是沒有提供 argArray 和 thisArg任何一個參數，那麼 Global 對象將被用做thisArg， 而且沒法被傳遞任何參數。

 

   call的說明 ：

      call 方法可將一個函數的對象上下文從初始的上下文改變爲由 thisArg指定的新對象。
      若是沒有提供 thisArg參數，那麼 Global 對象被用做 thisArg

      相關技巧：

       應用call和apply還有一個技巧在裏面，就是用 call 和 apply 應用另外一個函數（類）之後，當前的函數（類）就具有了另外一個函數（類）的方法或者是屬性，這也能夠稱之爲「繼承  

      」。看下面示例:

 1 // 繼承的演示
 2    function base() {
 3         this.member = " dnnsun_Member";
 4         this.method = function() {
 5             window.alert(this.member);
 6         }
 7    }
 8    function extend() {
 9         base.call(this);
10         window.alert(member);
11         window.alert(this.method);
12    }

 

   上面的例子能夠看出，經過call以後，extend能夠繼承到base的方法和屬性。

 

   順便提一下，在javascript框架prototype裏就使用apply來建立一個定義類的模式，

   其實現代碼以下：

1    var Class = {
2         create: function() {
3             return function() {
4                  this.initialize.apply(this, arguments);
5             }
6        }
7    }

 

  解析：從代碼看,該對象僅包含一個方法：Create，其返回一個函數，即類。但這也同時是類的構造函數，其中調用initialize，而這個方法是在類建立時定義的初始化函數。經過如此途 

  徑，就能夠實現prototype中的類建立模式

  示例： 

 1 var vehicle=Class.create();
 2   vehicle.prototype={
 3      initialize:function(type){
 4          this.type=type;
 5      }
 6      showSelf:function(){
 7          alert("this vehicle is "+ this.type);
 8      }
 9   }
10 
11    var moto=new vehicle("Moto");
12    moto.showSelf();

 

   更詳細的關於prototype信息請到其官方網站查看。

  demo:

 1 function myFuncOne() {
 2     this.p = "myFuncOne-";
 3     this.A = function(arg) {
 4         alert(this.p + arg);
 5     }
 6 }
 7 
 8 function myFuncTwo() {
 9     this.p = "myFuncTwo-";
10     this.B = function(arg) {
11         alert(this.p + arg);
12     }
13 }
14 function test() {
15     var obj1 = new myFuncOne();
16     var obj2 = new myFuncTwo();
17     obj1.A("testA");                       //顯示myFuncOne-testA
18     obj2.B("testB");                        //顯示myFuncTwo-testB
19     obj1.A.apply(obj2, ["testA"]);          //顯示myFuncTwo-testA,其中[ testA」]是僅有一個元素的數組
20     obj2.B.apply(obj1, ["testB"]);          //顯示myFuncOne-testB,其中[ testB」]是僅有一個元素的數組
21     obj1.A.call(obj2, "testA");             //顯示myFuncTwo-testA
22     obj2.B.call(obj1, "testB");             //顯示myFuncOne-testB
23 }
24 test();