this對象是在函數運行時,基于函數的執行環境綁定的。
其實這句話的本質就是,誰調用了函數,this就指向誰
具體的來說,通常有以下幾種情況:
全局函數
在全局環境中,this指向Window
//例子1 function A() { console.log(this) } A();//Window上面的例子很簡單,函數A在全局環境中執行,也就是全局對象Window調用了函數。此時this指向Window
對象方法
作為對象方法調用時,this指向調用該方法的對象
//例子2var b = { getThis:function(){ console.log(this) }}b.getThis()//b到這里我們舉的例子都比較簡單易懂,接下來來一個有意思的:
//例子3 var c = { getFunc:function(){ return function(){ console.log(this) } } } var cFun = c.getFunc() cFun()//Window這個例子和前一個例子不一樣,運行c.getFunc()時,首先返回的是一個匿名函數,我們將這個函數賦值給cFun,接著在全局環境中調用了cFun(),所以此時this指向的還是Window。
如果我們一定要讓這里返回的是c對象呢?在開頭我們說過,this對象是在函數執行時確定的,在例子3中,執行c.getFunc()時,this對象指向的還是c,所以我們只要保持住這個this就好了,對上面的代碼稍微改動:
//例子4 var c = { getFunc:function(){ var that = this //在這里保留住this return function(){ console.log(that) } } } var cFun = c.getFunc() cFun()//c這也就是我們經??梢栽谝恍┐a中看到var self = this或者var that = this之類的原因了。
call和apply
此時this對象通常指向函數中指定的this值(注意這里的通常2字,考試要考的)
call和apply算是老生常談,但還是稍微介紹下,怕新同學可能沒接觸過(其實是為了湊點字數),拿call來說,語法是這樣的
fun.call(thisArg, arg1, arg2, ...)
這個方法怎么用呢,看下面的例子:
//例子5var d = { getThis:function(){ console.log(this) }}var e = { name:'e'//(給e寫個`name`屬性只是因為覺得孤零零的太難看了~~)}d.getThis.call(e)//e在這里我們就可以看出call函數的意思了:指定一個對象o1去調用其他對象o2的方法,此時this對象指向o1
好了,那為什么前面我們說通常呢?因為,這里的thisArg是可以指定為null和undefined的。請看:
//例子6var d = { getThis:function(){ console.log(this) }} d.getThis.call(null)//Window d.getThis.call(undefined)//Window此時的this指向全局對象Window
箭頭函數
es6中的箭頭函數現在也用的比較頻繁,但是有個需要注意的點是:
|
新聞熱點
疑難解答
圖片精選