1. 程式人生 > >JS的call方法的作用解釋,簡單易懂

JS的call方法的作用解釋,簡單易懂

先看看關於call()的官方解釋,“呼叫一個物件的一個方法,以另一個物件替換當前物件。”,看了這樣的解釋,或許讓你更摸不著頭腦了。看例子:

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中,並不會出現這兩個屬性。