前言: this 是 JavaScript 比較特殊的關(guān)鍵字,運用的地方之廣,方式之靈活奠定了它的強(qiáng)大,但同時注定了它的難用 。自己剛開始學(xué)的時候被繞的很暈,為了徹底弄懂它查了很多資料。然后將自己學(xué)的東西整理了一下,以通俗易懂的方式表達(dá)出來,權(quán)當(dāng)做學(xué)習(xí)筆記,同時也可以給有需要的童鞋做下參考^_^
什么是this?
this 關(guān)鍵字的含義是明確且具體的,即指代當(dāng)前對象。即意味著這個 this 是在某種相對情況下才成立的。
this 被分為三種情況:全局對象、當(dāng)前對象或者任意對象;判斷處于那種情況,這完全取決于函數(shù)的調(diào)用方式,JavaScript 中主要的函數(shù)調(diào)用有以下幾種方式:
1. 作為普通函數(shù)調(diào)用
------這是我們最常用的方法,這種調(diào)用方式屬于全局調(diào)用,這里的 this 指的是全局對象
function test(){ this.a = 5; alert(this.a); alert(this);}test(); // 5 [object Window]如上所示:定義在全局的函數(shù), 函數(shù)的所有者就是當(dāng)前頁面, 也就是window對象,所以example()的調(diào)用對象就是Window,因此這里面的this就代表Window;
換一種寫法:
var a = 5;function test(){ var a = 10; alert(this.a);}test(); //5如上所示:test()函數(shù)內(nèi)部也聲明了一個變量a,但是調(diào)用test()的結(jié)果為5,說明此時函數(shù)內(nèi)部的this代表了全局對象即Window;
再換種寫法:
var a = 5;function test(){ this.a = 10;}test();alert(a); //10如上所示: 調(diào)用test()函數(shù),更改了全局變量a的值,即表明此時this代表全局對象。
2.作為對象函數(shù)的調(diào)用
------當(dāng)函數(shù)被某個對象調(diào)用時,此時this就指向了這個對象
var name="張三"; var person={ name:"李四", showName:function(){ alert(this.name); } } person.showName(); //輸出 李四 var other=person.showName; other(); //輸出 張三如上所示:執(zhí)行 person.showName()的結(jié)果為 李四,說明此時showName中的this指向了person;
而把person.showName賦給other后,因為other屬于全局變量,可以看成是window對象的一個屬性。所以當(dāng)調(diào)用other(),相當(dāng)于調(diào)用window.other(),因此this指向了window, 輸出結(jié)果為 張三;
所以說作為函數(shù)對象調(diào)用時,this就指向了這個調(diào)用的對象。
3. 作為構(gòu)造函數(shù)調(diào)用
------構(gòu)造函數(shù),就是通過這個函數(shù)生成一個新對象(object),這時候的 this 就會指向這個新對象;
function animal(){ this.name = "豆豆";}var dog = new animal();alert(dog.name); // 輸出 豆豆如上所示:通過new關(guān)鍵字生成一個object類型的對象并把它賦給dog,執(zhí)行這個構(gòu)造函數(shù)的話,會吧構(gòu)造函數(shù)作用域里的this指向這個對象,在這里就是指向了dog,因此this.name 等同于dog.name, 所以輸出結(jié)果為豆豆。
4.使用 apply 或 call 調(diào)用
------apply()是函數(shù)對象的一個方法,它應(yīng)用某一對象的一個方法,用另一個對象替換當(dāng)前對象。
var a = "張三";function test(){ alert(this.a);}var b = {};b.a = "李四";b.n = test;b.n(); //李四b.n.apply(); //張三b.n.apply(b); //李四如上所示:b.n()----因為調(diào)用的對象為b,所以this指向了b,this.a == b.a ,所以結(jié)果為李四;
b.n.apply----當(dāng)apply()的參數(shù)為空時,就是沒有對象去替換當(dāng)前對象,默認(rèn)用全局對象,所以this指向window,結(jié)果為張三;
b.n.apply(b)----指將當(dāng)前的this指向替換成b,因此this指向了b,結(jié)果為李四
(本文參考了網(wǎng)上的資料和一些書籍,如有錯誤之處,歡迎指出,將及時改正,么么噠O(∩_∩)O)
總結(jié):本文介紹了 JavaScript 中的 this 關(guān)鍵字在各種情況下的含義,實例都很簡單,這樣更能有助于加深理解。雖然這只是 JavaScript 中一個很小的概念,但借此我們可以了解 JavaScript 中函數(shù)的執(zhí)行環(huán)境,充分掌握this的相關(guān)知識有助于我們在編寫面向?qū)ο蟮腏avaScript程序時能夠游刃有余。最后,感謝您的觀看。
以上就是本文的全部內(nèi)容,希望本文的內(nèi)容對大家的學(xué)習(xí)或者工作能帶來一定的幫助,同時也希望多多支持武林網(wǎng)
新聞熱點
疑難解答