它代表函式執行時,自動生成的乙個內部物件,只能在函式內部使用。這句話看似平常,可是要非常注意三個字:「執行時」,這說明this關鍵字只與函式的執行環境有關,而與宣告環境沒有關係。也就是這個this到底代表的是什麼物件要等到函式執行時才知道,有點類似函式定義時的引數列表只在函式呼叫時才傳入真正的物件。理解了這一點對後面this關鍵字規律的掌握有很大幫助。
當函式被儲存為乙個物件的屬性時,它就可稱為這個物件的方法。當乙個方法被呼叫時,this被繫結到這個物件上。如果呼叫表示式包含乙個提取屬性的動作(. 或 ),那麼它被稱為方法呼叫。例如:
1
2
3
4
5
6
7
8
var
name =
"window"
;
var
obj =
};
obj.sayname();
//kxy
sayname函式作為物件obj的方法呼叫,所以函式體中的this就代表obj物件。
當乙個函式並非乙個物件的屬性時,那麼它就是被當做函式來呼叫的。在此種模式下,this被繫結為全域性物件,在瀏覽器環境下就是window物件。例如:
1
2
3
4
5
var
name =
"window"
;
function
sayname()
sayname();
sayname以函式呼叫模式呼叫,所以函式體中的this代表window物件。
如果在乙個函式前面加上new關鍵字來呼叫,那麼就會建立乙個連線到該函式的prototype成員的新物件,同時,this會被繫結到這個新物件上。這種情況下,這個函式就可以成為此物件的建構函式。例如:
1
2
3
4
5
function
obj()
var
person =
new
obj();
console.log(person.name);
//kxy
obj作為建構函式被呼叫,函式體內的this被繫結為新建立的物件person。
1
2
3
4
5
6
7
8
9
10
var
name =
"window"
;
var
person = ;
function
sayname()
sayname();
//window
//kxy
//window
自此,函式呼叫的4種模式就都介紹完了,this的繫結規律也就是以上幾種,萬變不離其宗。為了簡單明瞭的介紹4種模式,以上的例子都比較簡單,那麼下面就跟我一起做乙個稍複雜的練習,檢驗下自己是否真正掌握了this繫結物件的方法吧!
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
var
name =
"window"
;
function
showname()
var
person1 =
var
person2 =
}
person1.sayname();
//kxy
person2.sayname();
//window
首先心中時刻提醒自己this是在函式執行時被繫結的,不要被任何賦值語句打亂陣腳。
先看第乙個執行語句:person1.sayname(); 首先確定這是方法呼叫模式,物件為person1,再看sayname被賦值為全域性函式物件showname,在showname執行時,this繫結的是person1,所以結果為」kxy」。
再看第二個執行語句:person2.sayname(); 這還是方法呼叫模式,物件為person2,呼叫的是它的sayname方法。再看sayname函式體,發現函式體最終執行的函式是fun,fun是用函式呼叫模式呼叫的。而fun最終也被賦值為showname函式,因為fun是用函式呼叫模式呼叫的,所以這裡的this繫結為window,結果為」window「。
JS中的this物件詳解
js中this關鍵字很常見,但是它似乎變幻莫測,讓人抓狂。這篇文章就來揭示其中的奧秘。借助阮一峰老師的話 它代表函式執行時,自動生成的乙個內部物件,只能在函式內部使用。這句話看似平常,可是要非常注意三個字 執行時 這說明this關鍵字只與函式的執行環境有關,而與宣告環境沒有關係。也就是這個this到...
JS中的event 物件詳解
event屬性和方法 1.type 事件的型別,如onlick中的click 2.srcelement target 事件源,就是發生事件的元素 3.button 宣告被按下的滑鼠鍵,整數,1代表左鍵,2代表右鍵,4代表中鍵,如果按下多個鍵,酒把這些值加起來,所以3就代表左右鍵同時按下 firefo...
js中 Date物件中方法詳解
var mydate new date mydate.getfullyear 獲取完整的年份 mydate.getyear 獲取當前年份 2位 mydate.getfullyear 獲取完整的年份 4位 mydate.getmonth 獲取當前月份 0 11,0代表1月 mydate.getdate...