在js中,this關鍵字是一個比較讓人有意思的東西,但是它的指向經常讓初學者摸不著頭腦。
其實要理解這個關鍵字,需要理清兩個問題-「方法的呼叫和方法的觸發」
下面先看一段程式碼
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>function</title> <script> function showThis(){ console.info(this); } function Test1(){ this.f=showThis; } function Test2(){ this.f=function(){ showThis(); } } showThis();//window new Test1().f();//Test1 new Test2().f();//window </script> </head> <body> </body> </html>
20行印出window對象,這個很容易理解,但是21行印出Test1的實例對象,而22行卻印出window對象。看看Test1和Test2的構造,發現方法f最終都執行了showThis方法。但是showThis中的this指向卻不同。這是因為Test1中的f方法直接指向showThis,new Test1().f()是以Test1 的實例直接呼叫showThis方法,呼叫者是Test1的實例。而new Test2().f()是在Test2的實例方法f中觸發window物件的showThis方法,其中的this就是指向其呼叫者window而不是觸發者Test2的實例。
至此可以發現。 this指向的是呼叫者,而觸發者只是推進呼叫者執行指定方法而已。