javascript裏上下文this的理解和call()使用
阿新 • • 發佈:2017-05-05
指向 asc 傳遞 bsp say animal 指定 nim strong
call 方法
語法:call([thisObj[,arg1[, arg2[, [,.argN]]]]])
大概寫法:call(Object,arg1,arg2,...);
定義:調用一個對象的一個方法,以另一個對象替換當前對象。
說明:
call 方法可以用來代替另一個對象調用一個方法。call 方法可將一個函數的對象上下文從初始的上下文改變為由 thisObj 指定的新對象。
如果沒有提供 thisObj 參數,那麽 Global 對象被用作 thisObj。
文檔的定義略微高大上,看完還是雲裏霧裏的,還是通過幾個簡單的代碼來解釋一下:
//首先我們看一下這段代碼
functionAnimal(){ console.log(this); }
Animal();//輸出window
//這裏相當於Animal.call(undefined);this就是裏面的undefined,按理說應該是打印出undefined的,但是瀏覽器有一條規定:
//在非嚴格模式下當我們第一個參數傳遞為null或undefined時,函數體內的this會指向默認的宿主對象,在瀏覽器中則是window
如下面例子所示,fn並非屬於obj的方法,但是通過call,我們就能將fn內部的this綁定為obj,然後就可以使用this.a訪問obj的a屬性了。
var a = 10;
functionfn() {
console.log(this.a);
console.log(this);
}
var obj = {
a: 20
}
fn();//10,window
fn.call(obj);//20,obj
var Animal = { word: ‘words‘, say: function(str){ console.log(str +this.word); } } Animal.say(‘speak‘);//speak words
var cat = {
word:‘Miao‘
}
Animal.say.call(cat,‘speak‘);//speak Miao
上面例子中,我們定義一個Animal對象,它有word屬性和say方法,通過Animal.say()可以獲取它的word值。接著定義一個cat,它裏面只給定word屬性,Animal.say()理論上是指向Animal,但是通過call方法改變執行上下文,把Animal.say的this指向了cat。
實現繼承
function Animal(words){ this.words=words, this.say=function(){ console.log(this.words); } } function Cat(words){ Animal.call(this,words); } var cat = new Cat(‘Miao‘); cat.say();//Miao
javascript裏上下文this的理解和call()使用