JavaScript中神奇的call()方法

2019-11-20 12:58:07

字體：大中小

來源：轉載

供稿：網友

先看看關于call()的官方解釋，“調用一個對象的一個方法，以另一個對象替換當前對象?！?，看了這樣的解釋，或許讓你更摸不著頭腦了?？蠢樱?br />

var x = "我是全局變量";　　　　//定義全局變量x
function a(){　　　　　　　　　//定義函數類結構a　　
    this.x = "我是在函數類結構a中聲明的哦";    
}
//定義普通函數，彈出當前指針所包含的變量x的值
function f(){       
    alert (this.x);
}
//返回值為“我是在函數類結構a中聲明的哦”
f.call(new a());

我的理解是，f.call(new a())就是把函數（其實也是對象）f復制到被調用對象“new a()”下面去解析，事實上和下面這段代碼的解析結果一樣：

復制代碼代碼如下:

function a(){
　　this.x = "我是在函數類結構a中聲明的哦";
　　alert(this.x);    
}
a();

只不過此時變量X的作用域不同而已，咿…看起來好像有點繼承的味道哦，難道不是嗎？在上例中,f完全被構造函數a的實力對象繼承了，如果說這還不足以說明a.call(b)是一種繼承模式，那么再看一個更具有繼承味道的用法吧。

復制代碼代碼如下:

function f(){    
    this.a ="a";    
    this.b = function(){    
        alert("b");
    }
}
function e(){    
    f.call(this);     
}
var c = new e();
alert(c.a);  //彈出a
c.b();    //彈出b

在這個例子中，只要會使用瀏覽器的朋友，都能看得出來e完全繼承了f的屬性和方法，否則是無法解釋的，因為在e中并沒有定義屬性a和b，那么按常理推斷在e的實例對象c中，并不會出現這兩個屬性。

上一篇：JavaScript中return false的用法

下一篇：jquery實現無限分級橫向導航菜單的方法