掃蕩Javascript盲點(四)

今天我們說一說this

其實不想分享this,因為javascript的this實在是太複雜了。沒辦法,第一章說出的大話怎麼也得圓場啊

為什麼要使用this

作為一個開發者而言,我們完全不用理會這些高深的概念,遵循"夠用原則"就行。

但是如果你想了解你經常使用的一些API,插件,模塊是怎麼實現的話,那必須去啃這些概念性問題了。

說白了,拋去業務邏輯而言,我們寫的代碼只有一個目的,便於維護。

對this的誤解

誤解一,指向自身

掃蕩Javascript盲點(四)

this指向問題

我們寫了個fn函數,函數每執行一次,a的值就會加一,如果this是指向fn本身的話,fn執行兩次那a的值應該會累加的,但是當我們打印出來a的時候a的值還是0,說明this並沒有指向fn本身

誤解二,this 指向函數的作用域

需要明確的是,this 在任何情況下都不指向函數的詞法作用域。在 JavaScript 內部,作用域確實和對象類似,可見的標識符都是它的屬性。但是作用域“對象”無法通過 JavaScript 代碼訪問,它存在於 JavaScript 引擎內部。(紅寶書上面寫的,太深奧,不知道什麼意思,記著結論就好)

到底怎麼理解this

認真理解下面的話

this 是在運行時進行綁定的,並不是在編寫時綁定,它的上下文取決於函數調用時的各種條件。this 的綁定和函數聲明的位置沒有任何關係,只取決於函數的調用方式

也就是說,this指向問題,是在調用時決定的,不是在代碼運行時決定的,像變量的創建是代碼運行時決定的

一,普通函數中的this

在普通情況下就是全局,瀏覽器裡就是window;在use strict的情況下就是undefined

掃蕩Javascript盲點(四)

this指向

二,在構造函數中的this

當我們new一個函數時,就會自動把this綁定在新對象上,然後再調用這個函數。它會覆蓋bind的綁定。(第二節講的使用new內部執行時,有解釋過相關內容)

掃蕩Javascript盲點(四)

this指向

三,在call、applay、bind中的this

掃蕩Javascript盲點(四)

this指向

通過 foo.call(..),我們可以在調用 foo 時強制把它的 this 綁定到 obj上。 從 this 綁定的角度來說,call(..) 和 apply(..) 是一樣的,它們的區別體現 在其他的參數上

四,在上下文綁定對象調用中的this

如果用到this的那個函數是屬於某個 context object 的,那麼這個 context object 綁定到this

掃蕩Javascript盲點(四)

this指向

returnThis是boss調用的,所有this指向boss


分享到:


相關文章: