探索Javascript中this的奧秘

什么是this？

this 關(guān)鍵字的含義是明確且具體的，即指代當(dāng)前對(duì)象。即意味著這個(gè) this 是在某種相對(duì)情況下才成立的。

this 被分為三種情況：全局對(duì)象、當(dāng)前對(duì)象或者任意對(duì)象;判斷處于那種情況，這完全取決于函數(shù)的調(diào)用方式，JavaScript 中主要的函數(shù)調(diào)用有以下幾種方式：

作為普通函數(shù)調(diào)用

作為對(duì)象方法調(diào)用

作為構(gòu)造函數(shù)調(diào)用

使用 apply 或 call 調(diào)用

1. 作為普通函數(shù)調(diào)用

------這是我們最常用的方法，這種調(diào)用方式屬于全局調(diào)用，這里的 this 指的是全局對(duì)象

如上所示：定義在全局的函數(shù), 函數(shù)的所有者就是當(dāng)前頁面, 也就是window對(duì)象，所以example()的調(diào)用對(duì)象就是Window，因此這里面的this就代表Window;

換一種寫法:

如上所示：test()函數(shù)內(nèi)部也聲明了一個(gè)變量a，但是調(diào)用test()的結(jié)果為5，說明此時(shí)函數(shù)內(nèi)部的this代表了全局對(duì)象即Window;

再換種寫法：

如上所示： 調(diào)用test()函數(shù)，更改了全局變量a的值，即表明此時(shí)this代表全局對(duì)象。

2.作為對(duì)象函數(shù)的調(diào)用

------當(dāng)函數(shù)被某個(gè)對(duì)象調(diào)用時(shí)，此時(shí)this就指向了這個(gè)對(duì)象

如上所示：執(zhí)行 person.showName()的結(jié)果為 李四，說明此時(shí)showName中的this指向了person；

而把person.showName賦給other后，因?yàn)閛ther屬于全局變量，可以看成是window對(duì)象的一個(gè)屬性。所以當(dāng)調(diào)用other()，相當(dāng)于調(diào)用window.other()，因此this指向了window, 輸出結(jié)果為 張三；

所以說作為函數(shù)對(duì)象調(diào)用時(shí)，this就指向了這個(gè)調(diào)用的對(duì)象。

3. 作為構(gòu)造函數(shù)調(diào)用

------構(gòu)造函數(shù)，就是通過這個(gè)函數(shù)生成一個(gè)新對(duì)象（object），這時(shí)候的 this 就會(huì)指向這個(gè)新對(duì)象；

如上所示：通過new關(guān)鍵字生成一個(gè)object類型的對(duì)象并把它賦給dog,執(zhí)行這個(gè)構(gòu)造函數(shù)的話，會(huì)吧構(gòu)造函數(shù)作用域里的this指向這個(gè)對(duì)象，在這里就是指向了dog,因此this.name 等同于dog.name, 所以輸出結(jié)果為豆豆。

4.使用 apply 或 call 調(diào)用

------apply()是函數(shù)對(duì)象的一個(gè)方法，它應(yīng)用某一對(duì)象的一個(gè)方法，用另一個(gè)對(duì)象替換當(dāng)前對(duì)象。

如上所示：b.n()----因?yàn)檎{(diào)用的對(duì)象為b，所以this指向了b，this.a == b.a ，所以結(jié)果為李四；

　　　　　b.n.apply----當(dāng)apply()的參數(shù)為空時(shí)，就是沒有對(duì)象去替換當(dāng)前對(duì)象，默認(rèn)用全局對(duì)象，所以this指向window，結(jié)果為張三；

　　　　　b.n.apply(b)----指將當(dāng)前的this指向替換成b，因此this指向了b，結(jié)果為李四

（本文參考了網(wǎng)上的資料和一些書籍，如有錯(cuò)誤之處，歡迎指出，將及時(shí)改正，么么噠O(∩_∩)O）

總結(jié)：本文介紹了 JavaScript 中的 this 關(guān)鍵字在各種情況下的含義，實(shí)例都很簡單，這樣更能有助于加深理解。雖然這只是 JavaScript 中一個(gè)很小的概念，但借此我們可以了解 JavaScript 中函數(shù)的執(zhí)行環(huán)境，充分掌握this的相關(guān)知識(shí)有助于我們?cè)诰帉懨嫦驅(qū)ο蟮腏avaScript程序時(shí)能夠游刃有余。最后，感謝您的觀看。

聲明：本網(wǎng)頁內(nèi)容旨在傳播知識(shí)，若有侵權(quán)等問題請(qǐng)及時(shí)與本網(wǎng)聯(lián)系，我們將在第一時(shí)間刪除處理。TEL:177 7030 7066 E-MAIL:11247931@qq.com