JavaScript中this關鍵字(上)

js中this這個關鍵字,被自動定義在所有函數的作用域中,先來看一段簡單的代碼:

圖 1


在圖1中所示,this關鍵字則指向了person這個對象,即this可以隱式的傳遞對象,如果不使用this,則需將this替換成person(如圖2中所示)。

this是在運行時進行的綁定,而不是在編寫時指定的,這是上一遍作用域中提及過的一點javascript中的作用域 - 簡書。this的綁定和函數聲明的位置沒有任何關系,只是取決于函數的調用方式。函數在調用時會創建一個執行上下文,上下文中會包含函數在哪里調用,函數的調用方法等信息,this只是這個執行上下文的一個屬性。

那怎么樣去判斷this指向的對象是什么呢?很簡單,this只指向最近的一個調用者。那就先說說怎么樣去綁定this。

綁定this有四種情況:默認綁定,隱式綁定,顯示綁定,new關鍵字綁定

1.默認綁定:先看一段代碼


圖 3

如圖3所示,this.b的值是2,為什么會把this.b解析成全局環境中的var b = 2 ?首先先了解一個概念:申明在全局作用域中的變量就是全局對象中的一個同名屬性,兩者本質上就是一個東西。其次,函數 a在調用時沒有使用任何的修飾符(call,apply,new......),所以this默認是指向的window,所以this.b = 2;

注意:嚴格模式下無法使用此規則(順便吐槽一句:簡書上沒法使用紅色的字體嗎?本來這里想劃重點的)。

2.隱式綁定:還是先看代碼吧


圖 4

圖4中可以看到,obj.a = a函數,在調用的時候使用了obj.a去調用a函數,所以this則指向了obj。隱式綁定中,主要是看函數調用時是否擁有一個上下文對象,隱式綁定會把函數調用中的上下文對象綁定到this上,即obj這個對象擁有了函數a,所以a函數中的this指向了obj,this.b = obj.b。注意:對象屬性引用中只有最頂層或者最后一層會影響調用位置,上代碼


圖 5

由上圖可見:函數a中的this.b還是obj中的屬性b的值,而不是obj1中的b值。


后續:JavaScript中this關鍵字(下) - 簡書

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。

推薦閱讀更多精彩內容