淺談js中this的指向問題

this最終指向的是調(diào)用它的那個(gè)對(duì)象

1漩仙、在普通函數(shù)里的this指向

例子1:

運(yùn)行結(jié)果:

這里的this最終指向window志衍,因?yàn)檫@里是window調(diào)用的findThis()方法

例子2:

運(yùn)行結(jié)果:


這里的this指向findThis望门,因?yàn)檫@里是findThis調(diào)用的logName()方法

注意:this的指向在函數(shù)創(chuàng)建的時(shí)候是決定不了的辛润,在調(diào)用的時(shí)候才能決定杜秸,誰(shuí)調(diào)用就指向誰(shuí)结耀。

例子3:

運(yùn)行結(jié)果:

這里的this和例子2的this的指向是一樣的,都是指向findThis崎脉,因?yàn)檫@里是window下面的findThis屬性直接調(diào)用的logName()方法,而不是window直接調(diào)用的拧咳,所以這里的this指向的是findThis

例子4:


運(yùn)行結(jié)果:


可以發(fā)現(xiàn),同樣是通過(guò)findThis點(diǎn)出來(lái)的囚灼,但是這里的this指向的卻是age而不是findThis骆膝,對(duì)比上方的幾個(gè)例子,你會(huì)更加能理解this的指向問題灶体。

例子5:

運(yùn)行結(jié)果:

這里的this指向window阅签,如果懵了的話,就說(shuō)明蝎抽,你還未理解這句話:this指向的永遠(yuǎn)是最后調(diào)用它的那個(gè)對(duì)象政钟,也就是看它執(zhí)行的時(shí)候是誰(shuí)調(diào)用的。雖然logName()是被對(duì)象age所引用樟结,但是在將它賦值給變量b的時(shí)候并沒有執(zhí)行這個(gè)方法养交,而是賦值之后才通過(guò)window來(lái)調(diào)用的,所以這里的this指向的是window瓢宦。

總結(jié)

  • 如果一個(gè)函數(shù)中有this碎连,但是它沒有被上一級(jí)的對(duì)象所調(diào)用,那么this指向的就是window刁笙。
  • 如果一個(gè)函數(shù)中有this破花,這個(gè)this被上一級(jí)的對(duì)象所調(diào)用,那么this就指向上一級(jí)的對(duì)象疲吸。
  • 如果一個(gè)函數(shù)中有this座每,這個(gè)函數(shù)中包含多個(gè)對(duì)象,盡管這個(gè)函數(shù)是否被最外層的對(duì)象所調(diào)用摘悴,this指向的也只是它的上一級(jí)的對(duì)象峭梳。

2、在構(gòu)造函數(shù)里的this指向

例子1:


運(yùn)行結(jié)果:


這里的對(duì)象b可以點(diǎn)出函數(shù)FindThis()里面的names是因?yàn)閚ew關(guān)鍵字可以改變this的指向蹂喻,將這個(gè)this指向了對(duì)象b(new關(guān)鍵字就是創(chuàng)建了一個(gè)實(shí)例對(duì)象葱椭,相當(dāng)于把FindThis復(fù)制了一份到b里面),此時(shí)僅僅是創(chuàng)建而已口四,并沒有執(zhí)行孵运,而調(diào)用FindThis()方法的是對(duì)象b,所以this指向?qū)ο骲蔓彩,所以可以打印出names治笨。

當(dāng)this遇到return:
例子:

比較上面的幾個(gè)例子,會(huì)發(fā)現(xiàn):如果返回值是一個(gè)對(duì)象赤嚼,那么this指向的就是那個(gè)返回的對(duì)象旷赖,如果返回值不是一個(gè)對(duì)象,那么this還是指向函數(shù)的實(shí)例

特殊情況:null雖然也是對(duì)象更卒,但是在這里this還是指向那個(gè)函數(shù)的實(shí)例對(duì)象
例子:

3等孵、綁定事件的this指向

例子:


運(yùn)行結(jié)果:

這里的this指向的是<button id="btn">按鈕</button>,得出的結(jié)論:元素綁定事件蹂空,事件觸發(fā)后俯萌,執(zhí)行的函數(shù)中的this指向的是當(dāng)前元素

4、定時(shí)器中的this指向

例子1:


運(yùn)行結(jié)果:

例子2:

運(yùn)行結(jié)果:

這里的this都是指向window上枕,得出結(jié)論:定時(shí)器中的this绳瘟,指向的是window

5、綁定了bind的函數(shù)中的this指向

例子:

運(yùn)行結(jié)果:

得出結(jié)論:函數(shù)調(diào)用時(shí)如果綁定了bind姿骏,那么函數(shù)中的this指向了bind中綁定的元素

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
  • 序言:七十年代末糖声,一起剝皮案震驚了整個(gè)濱河市,隨后出現(xiàn)的幾起案子分瘦,更是在濱河造成了極大的恐慌蘸泻,老刑警劉巖,帶你破解...
    沈念sama閱讀 211,265評(píng)論 6 490
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件嘲玫,死亡現(xiàn)場(chǎng)離奇詭異悦施,居然都是意外死亡,警方通過(guò)查閱死者的電腦和手機(jī)去团,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 90,078評(píng)論 2 385
  • 文/潘曉璐 我一進(jìn)店門抡诞,熙熙樓的掌柜王于貴愁眉苦臉地迎上來(lái)穷蛹,“玉大人,你說(shuō)我怎么就攤上這事昼汗‰妊” “怎么了?”我有些...
    開封第一講書人閱讀 156,852評(píng)論 0 347
  • 文/不壞的土叔 我叫張陵顷窒,是天一觀的道長(zhǎng)蛙吏。 經(jīng)常有香客問我,道長(zhǎng)鞋吉,這世上最難降的妖魔是什么鸦做? 我笑而不...
    開封第一講書人閱讀 56,408評(píng)論 1 283
  • 正文 為了忘掉前任,我火速辦了婚禮谓着,結(jié)果婚禮上泼诱,老公的妹妹穿的比我還像新娘。我一直安慰自己赊锚,他們只是感情好坷檩,可當(dāng)我...
    茶點(diǎn)故事閱讀 65,445評(píng)論 5 384
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著改抡,像睡著了一般矢炼。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發(fā)上阿纤,一...
    開封第一講書人閱讀 49,772評(píng)論 1 290
  • 那天句灌,我揣著相機(jī)與錄音,去河邊找鬼欠拾。 笑死胰锌,一個(gè)胖子當(dāng)著我的面吹牛,可吹牛的內(nèi)容都是我干的藐窄。 我是一名探鬼主播资昧,決...
    沈念sama閱讀 38,921評(píng)論 3 406
  • 文/蒼蘭香墨 我猛地睜開眼,長(zhǎng)吁一口氣:“原來(lái)是場(chǎng)噩夢(mèng)啊……” “哼荆忍!你這毒婦竟也來(lái)了格带?” 一聲冷哼從身側(cè)響起,我...
    開封第一講書人閱讀 37,688評(píng)論 0 266
  • 序言:老撾萬(wàn)榮一對(duì)情侶失蹤刹枉,失蹤者是張志新(化名)和其女友劉穎叽唱,沒想到半個(gè)月后,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體微宝,經(jīng)...
    沈念sama閱讀 44,130評(píng)論 1 303
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡棺亭,尸身上長(zhǎng)有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 36,467評(píng)論 2 325
  • 正文 我和宋清朗相戀三年,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了蟋软。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片镶摘。...
    茶點(diǎn)故事閱讀 38,617評(píng)論 1 340
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡嗽桩,死狀恐怖,靈堂內(nèi)的尸體忽然破棺而出凄敢,到底是詐尸還是另有隱情碌冶,我是刑警寧澤,帶...
    沈念sama閱讀 34,276評(píng)論 4 329
  • 正文 年R本政府宣布贡未,位于F島的核電站,受9級(jí)特大地震影響蒙袍,放射性物質(zhì)發(fā)生泄漏俊卤。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 39,882評(píng)論 3 312
  • 文/蒙蒙 一害幅、第九天 我趴在偏房一處隱蔽的房頂上張望消恍。 院中可真熱鬧,春花似錦以现、人聲如沸狠怨。這莊子的主人今日做“春日...
    開封第一講書人閱讀 30,740評(píng)論 0 21
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽(yáng)佣赖。三九已至,卻和暖如春记盒,著一層夾襖步出監(jiān)牢的瞬間憎蛤,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 31,967評(píng)論 1 265
  • 我被黑心中介騙來(lái)泰國(guó)打工纪吮, 沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留俩檬,地道東北人。 一個(gè)月前我還...
    沈念sama閱讀 46,315評(píng)論 2 360
  • 正文 我出身青樓碾盟,卻偏偏與公主長(zhǎng)得像棚辽,于是被迫代替她去往敵國(guó)和親。 傳聞我的和親對(duì)象是個(gè)殘疾皇子冰肴,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 43,486評(píng)論 2 348