this涣脚、call 和 apply

Js中的this總是指向一個對象,而具體指向哪一個對象是在運行時基于函數(shù)的執(zhí)行環(huán)境動態(tài)綁定的寥茫,而非函數(shù)被聲明時的環(huán)境遣蚀。

this的指向大致可以分為以下4種。

  • 作為對象的方法調(diào)用(當(dāng)函數(shù)作為對象的方法被調(diào)用時纱耻,this指向該對象)
const obj = {
    a: 1,
    getA: () => {
        console.log(this === obj); // true
        console.log(this.a === 1); // true
    },
};
obj.getA();
  • 作為普通函數(shù)調(diào)用
    當(dāng)函數(shù)不作為對象的屬性被調(diào)用時芭梯,也就是我們常說的普通函數(shù)方式,此時的this總是指向全局對象弄喘。在瀏覽器的Js中玖喘,這個全局對象是window對象。
window.name = 'globalName';
const getName = () => console.log(this.name);
getName(); // 輸出globalName
  • 構(gòu)造器調(diào)用
    Js中沒有類蘑志,但是可以從構(gòu)造函數(shù)中創(chuàng)造對象芒涡,同時也提供了new運算符,使得構(gòu)造器看起來更像一個類卖漫。
    除了宿主提供的一些內(nèi)置函數(shù)费尽,大部分Js函數(shù)都可以當(dāng)做構(gòu)造器使用。構(gòu)造器的外表跟普通函數(shù)一模一樣羊始,它們的區(qū)別在于被調(diào)用的方式旱幼。當(dāng)用new運算符調(diào)用函數(shù)時,該函數(shù)總會返回一個對象突委,通常情況下柏卤,構(gòu)造器里的this就指向返回的這個對象。
const myClass = () => {
    this.name = 'yuehun';
};
const obj = new myClass();
console.log(obj.name); // 輸出yuehun

但當(dāng)用new調(diào)用構(gòu)造器時匀油,還要注意一個問題缘缚,如果構(gòu)造器顯式地返回了一個object類型的對象,那么此次運算結(jié)果最終會返回這個對象敌蚜,而不是我們之前期待的this桥滨。

const myClass = {
    this.name = 'john';
    return {
        name: 'yuehun',
    };
};
const obj = new myClass();
console.log(obj.name); // 輸出yuehun

如果構(gòu)造器不顯式地返回任何數(shù)據(jù),或者是返回一個非對象類型的數(shù)據(jù),就不會造成上述問題

const myClass = () => {
    this.name = 'yuehun';
    return 'john';
};
const obj = new myClass();
console.log(obj.name); // 輸出yuehun
  • Function.prototype.call或Function.prototype.apply調(diào)用
    跟普通的函數(shù)相比齐媒,用這兩種方式能動態(tài)地改變傳入函數(shù)的this
const obj1 = {
    name: 'john',
    getName: () => this.name,
};
const obj2 = {
    name: 'yuehun',
};
console.log(obj1.getName()); // 輸出john
console.log(obj1.getName.call(obj2)); // 輸出yuehun
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末蒲每,一起剝皮案震驚了整個濱河市,隨后出現(xiàn)的幾起案子喻括,更是在濱河造成了極大的恐慌邀杏,老刑警劉巖,帶你破解...
    沈念sama閱讀 211,639評論 6 492
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件唬血,死亡現(xiàn)場離奇詭異望蜡,居然都是意外死亡,警方通過查閱死者的電腦和手機拷恨,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 90,277評論 3 385
  • 文/潘曉璐 我一進店門泣特,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人挑随,你說我怎么就攤上這事状您。” “怎么了兜挨?”我有些...
    開封第一講書人閱讀 157,221評論 0 348
  • 文/不壞的土叔 我叫張陵膏孟,是天一觀的道長。 經(jīng)常有香客問我拌汇,道長柒桑,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 56,474評論 1 283
  • 正文 為了忘掉前任噪舀,我火速辦了婚禮魁淳,結(jié)果婚禮上,老公的妹妹穿的比我還像新娘与倡。我一直安慰自己界逛,他們只是感情好,可當(dāng)我...
    茶點故事閱讀 65,570評論 6 386
  • 文/花漫 我一把揭開白布纺座。 她就那樣靜靜地躺著息拜,像睡著了一般。 火紅的嫁衣襯著肌膚如雪净响。 梳的紋絲不亂的頭發(fā)上少欺,一...
    開封第一講書人閱讀 49,816評論 1 290
  • 那天,我揣著相機與錄音馋贤,去河邊找鬼赞别。 笑死,一個胖子當(dāng)著我的面吹牛配乓,可吹牛的內(nèi)容都是我干的仿滔。 我是一名探鬼主播惠毁,決...
    沈念sama閱讀 38,957評論 3 408
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場噩夢啊……” “哼堤撵!你這毒婦竟也來了仁讨?” 一聲冷哼從身側(cè)響起羽莺,我...
    開封第一講書人閱讀 37,718評論 0 266
  • 序言:老撾萬榮一對情侶失蹤实昨,失蹤者是張志新(化名)和其女友劉穎,沒想到半個月后盐固,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體荒给,經(jīng)...
    沈念sama閱讀 44,176評論 1 303
  • 正文 獨居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 36,511評論 2 327
  • 正文 我和宋清朗相戀三年刁卜,在試婚紗的時候發(fā)現(xiàn)自己被綠了志电。 大學(xué)時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
    茶點故事閱讀 38,646評論 1 340
  • 序言:一個原本活蹦亂跳的男人離奇死亡蛔趴,死狀恐怖挑辆,靈堂內(nèi)的尸體忽然破棺而出,到底是詐尸還是另有隱情孝情,我是刑警寧澤鱼蝉,帶...
    沈念sama閱讀 34,322評論 4 330
  • 正文 年R本政府宣布,位于F島的核電站箫荡,受9級特大地震影響魁亦,放射性物質(zhì)發(fā)生泄漏。R本人自食惡果不足惜羔挡,卻給世界環(huán)境...
    茶點故事閱讀 39,934評論 3 313
  • 文/蒙蒙 一洁奈、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧绞灼,春花似錦利术、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 30,755評論 0 21
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至商佛,卻和暖如春喉钢,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背良姆。 一陣腳步聲響...
    開封第一講書人閱讀 31,987評論 1 266
  • 我被黑心中介騙來泰國打工肠虽, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留,地道東北人玛追。 一個月前我還...
    沈念sama閱讀 46,358評論 2 360
  • 正文 我出身青樓税课,卻偏偏與公主長得像闲延,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個殘疾皇子韩玩,可洞房花燭夜當(dāng)晚...
    茶點故事閱讀 43,514評論 2 348

推薦閱讀更多精彩內(nèi)容

  • this JavaScript里面的this總是指向一個對象找颓,而具體指向哪個對象是在運行時基于函數(shù)的執(zhí)行環(huán)境動態(tài)綁...
    Tiny_z閱讀 172評論 0 1
  • 1:this 跟大多數(shù)的語言一樣,javascript的this總是指向一個對象合愈,而具體指向哪個對象是在運行時基于...
    臭臭臭魁閱讀 147評論 0 2
  • 出發(fā) 在還沒定方向之前 出發(fā) 在還沒做計劃之時 出發(fā) 在不知道歸期之下 何必需要歸期 就像人生注定沒有回程 因為沒...
    Zing13閱讀 178評論 0 0
  • ChatOPS是什么鬼與DevOPS有什么區(qū)別? 確切的說ChatOPS與DevOPS是并行的击狮,他們在職能上完全不...
    uglybob閱讀 1,240評論 0 0
  • 1 醒了佛析,起床。 沒有任何的糾結(jié)和痛苦彪蓬,走到客廳寸莫,抬頭看下掛鐘,五點十分〉刀現(xiàn)階段的自己膘茎,自然醒已經(jīng)成為了一個習(xí)慣。...
    凈靜辰長閱讀 502評論 1 2