DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> JavaScript入門知識 >> 關於JavaScript >> javascript中caller和callee詳解
javascript中caller和callee詳解
編輯:關於JavaScript     

最近學習javascript,碰到caller和callee的問題,去網上百度了很多。搜到的內容大同小益,整理總結了一下與大家分享。

caller:返回一個對調用function函數的函數的引用(用法:function.caller)

說明:對於函數來說,caller屬性只有在函數執行時才有定義。如果函數由頂層調用,caller則為null。

var time = 3 //控制次數,去掉會一直在caller與handleCaller交替不斷執行
function caller() {
  caller.caller()//返回調用caller函數的函數引用
}
function handleCaller() {
  if (time > 0){
    time--
    alert(handleCaller.caller)//返回調用handleCaller函數的函數引用
    alert(caller.caller)//返回調用caller函數的函數引用
    caller()
  }
}
handleCaller()

例子分析:第一次handleCaller運行的時候,兩個alert返回的都是null,alert(handleCaller.caller)返回null是因為它是由頂層調用, alert(caller.caller)返回null是因為caller的默認值是null。接下去caller()函數被調用,caller.caller返回的是調用它的函數(handleCaller)的引用,通過caller.caller()可以再次調用handleCaller函數。第二次handleCaller運行的時候,alert(handleCaller.caller)返回的是caller代碼(其實就是caller的引用),alert(caller.caller)返回的是handleCaller代碼。因為函數之間的調用關系是handleCaller->caller->handleCaller。之後就不斷在2個函數之間交替執行。

caller指向調用當前函數的函數,但是有一點,如果是在全局作用域內(即頂層window)被調用,則返回null。
代碼走起

====================
function testCaller(){
if(testCaller.caller == null){
console.log('accessed at global');
}else{
console.log('accessed at ' + testCaller.caller);
}
}


在全局調用

testCaller(); // accessed at global

在一個函數中調用

function a(){
testCaller();
}
a(); // accessed at function a(){testCaller();} 

此時,testCaller.caller指向就是 function a

callee:返回相對應的arguments的函數引用。(多用於匿名函數遞歸)

說明:也許你在網上看到最多的是callee返回正在執行的函數引用。我是這麼理解,每個函數都有一個自己的arguments,通常是用來存放參數的。arguments有一個callee 屬性,初始值就是對應自身的函數引用。當你函數執行到該語句時,arguments是默認對應的是你現在執行的函數,那麼arguments.callee為當前正在執行的函數的引用。當然如果你有標記過其他函數的arguments(例子中的args),自然可以用args.callee()去再次調用那個函數。

function a(){
  alert(arguments.callee)
  var args = arguments
  function c(){
    alert(arguments.callee)
    args.callee()
  }
  c()
}
a()

例子分析:例子中的arguments.callee都是默認返回當前正在執行的函數的引用(a中返回a自身函數引用,c中返回c自身函數引用),而通過用args存放a函數的arguments,在內置函數c中使用args.callee()再次調用a函數。

====================
function a(x){

if(x<=1)
return x;
else
return x + a(x-1);
}
a(12) // 78

這是一個極簡的遞歸,運行結果正常。


再看看下面的調用方法

var b = a;
a = null; // 將a回收
b(12); // erro : 'a' is not a function



原因也簡單,b=a,b=function a(){};在b調用之前,我們用了a=null。所以在 function a 運行的時候,其中的return x + a(x-1);中的a,指向的就是null,而不是 function a。
所以就報錯了,如何解決這樣的問題。我們將a換一種寫法

function a(x){
if(x<=1)
return x;
else
return arguments.callee(x-1); // 這句是改變的地方
}

再調用

var b = a;
a = null;
b(12); // 78

原因:雖然我們將a=null了,但是函數a中並沒有用到a,而是通過arguments.callee指向當前函數。
因為arguments.callee的定義就是:返回正在執行的函數。

XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved