this
this的指向在函數(shù)定義的時候是確定不了的,只有函數(shù)執(zhí)行的時候才能確定this到底指向誰,實際上
this的最終指向的是那個調用它的對象(這里其實并不完全對,this的指向有時候會很微妙,得靠自己去慢慢體會)
只有方法在對象上,對象調用當前方法,指向當前對象
function fnThis(){ let user='js'; console.log(this.user)//undefined console.log(this)//global(window)}fnThis();
這里為什么會輸出一個全局的對象?因為我們申明的函數(shù),在全局里,現(xiàn)在執(zhí)行這個函數(shù)
實際上是全局在調用
let obj={ user:'js', fn:function(){ console.log(this.user) }obj.fn();
這里是obj在調用,所以指向我們的obj,這并不能說明,我們一開始就說的this最終調用他的那個
對象
let obj={ user:'js', objTwo:{ user:'css', fn:function(){ console.log(this.user) } }}obj.objTwo.fn();
這里只是指向了obj2,而并沒有指向最終調用它的obj.
來個料咋們看看this這家伙
<button id="myBtn" value="按鈕">按鈕</button><script>let myBtn=document.querySelector("#myBtn")let fn=function(){ console.log(this);}myBtn.onclick=function(){ fn();//輸出的全局 console.log(this);//輸出的是這個button}</script>
這里從表面看,會認為第一個輸出的是這個btn按鈕,不是說誰調用指向誰么,但是咋們仔細看這個是btn在調用么???
其實是這個點擊事件的匿名函數(shù)在調用,而這fn()本身是全局上下文的函數(shù),它的this指向的是全局,它是作為這個匿名函數(shù)的普通函數(shù),自然指向的全局
我們如果這樣寫
myBtn.onclick=fn;//btn點擊的時候就指向這個btn了,這時候輸出結果為這個button,
總結
1. 全局上下文,或者普通函數(shù)上下文里面的this,包括函數(shù)里面的普通函數(shù),都是指向全局
2. 在對象方法里面的this指向該對象
3. 在事件方法里面的this指向發(fā)生事件的這個對象
特殊情況
let obj={ user:'js', objTwo:{ user:'css', fn:function(){ console.log(this.user) console.log(this) } }}let objThre=obj.objTwo.fn;objThree();
把函數(shù)賦值給了objThree,而objThree是在全局上,所以輸出的是全局
補充
let chinesePeople=function(){ this.name='張飛'; return obj }
如果返回的是對象,this就指向返回的那個對象,否則就指向實例對象
改變的幾種方式
let obj={a:80}let objTwo={ a:70, fn:function(){ console.log(this.a); }}
objTwo.fn.call(obj);
調用一個方法,并改變其this指向
objTwo.fn.apply(obj);
調用一個方法,并改變其this指向
前2者區(qū)別,在于后面的參數(shù),一個是順序,一個是數(shù)組
objTwo.fn.bind(obj)();
bind()方法會創(chuàng)建一個新函數(shù),在綁定后,我們可以加括號立即執(zhí)行,也可以等需要執(zhí)行再執(zhí)行
第一個參數(shù)對象,以后的順序傳參
new方法,其實是隱藏的調用了一個call的方法
以上這篇淺談js中的this問題就是小編分享給大家的全部內容了,希望能給大家一個參考,也希望大家多多支持武林網(wǎng)。
|
新聞熱點
疑難解答