国产xxxx99真实实拍_久久不雅视频_高清韩国a级特黄毛片_嗯老师别我我受不了了小说

資訊專欄INFORMATION COLUMN

【this】談一下js中this的指向和箭頭函數(shù)的特殊情況

csRyan / 2625人閱讀

摘要:的指向一直都是理解中比較困難的部分,這次把遇見的情況都展示出來另外新增的箭頭函數(shù)不屬于這個(gè)規(guī)律,特殊看待。

this的指向一直都是js理解中比較困難的部分,這次把遇見的情況都展示出來;另外ES6新增的箭頭函數(shù)不屬于這個(gè)規(guī)律,特殊看待。

this的指向 大致分為以下幾種情況

1.普通函數(shù) --- this指向函數(shù)的調(diào)用對(duì)象
function f() {  
    var user = "XX";  
    console.log(this.user);  //undefined
    console.log(this);  //window
}

f();

這里f 的調(diào)用等同于window.f(); 所以f函數(shù)內(nèi)部this指向的是window

2.對(duì)象方法中調(diào)用 ---- this 指向上級(jí)對(duì)象
var obj = {
    user:"xxx",
    fn:function(){
        console.log(this.user);  //xxx
    }
}
obj.fn();

【注1】這里要注意一點(diǎn),就是在對(duì)象中可能有多層嵌套的對(duì)象,但是this指向的都是他調(diào)用地方的上級(jí)對(duì)象

var obj = {
    user:"xxx",
    b: {
        user: "bbb",
        fn:function(){
            console.log(this.user);  // bbb
        }
    }
    
}
obj.b.fn();

如上,雖然是在obj里面this調(diào)用,但是因?yàn)槭窃趏bj.b這個(gè)對(duì)象中,所以this指向的是 obj.b

【注2】注意不能只看上級(jí)對(duì)象,更關(guān)鍵的是調(diào)用對(duì)象

var obj = {
    user:"xxx",
    b: {
        user: "bbb",
        fn:function(){
            console.log(this.user);  // undefined
        }
    }
    
}
var f = obj.b.fn;
f()

如上,this其實(shí)是在f執(zhí)行的時(shí)候調(diào)用的,這時(shí)候,f的this的調(diào)用對(duì)象是window,那么就可以理解window.user為undefined

【小結(jié)】在對(duì)象方法中的this的指向主要是看他最終調(diào)用的位置,它是由誰調(diào)用的,如果調(diào)用對(duì)象有多層,this指向的是this的上級(jí)對(duì)象

3.構(gòu)造函數(shù) --- this指向new出來的對(duì)象
function Fn(){
    this.user = "xxx;
}
var a = new Fn();
console.log(a.user); //xxx

new 的過程其實(shí)也是初始化了一個(gè)新的對(duì)象,然后用新的對(duì)象調(diào)用原先的函數(shù) Fn.call(a) 這個(gè)情況跟下面這種情況類似了。

4.apply, call, bind 通過改變函數(shù)的調(diào)用對(duì)象而改變this的指向
function foo() {
  console.log("id:", this.id);  //42
}

var id = 21;

foo.call({ id: 42 });   //foo函數(shù)的調(diào)用對(duì)象變成了 {id: 42},所以this指向發(fā)生了變化
5.箭頭函數(shù)this的指向 ---- this指向其定義時(shí)候的對(duì)象

??

圖1: 箭頭函數(shù),this指向定義時(shí)候的對(duì)象,foo在window作用域下,所以this指向window; ===> 箭頭函數(shù)的外層,foo函數(shù)的this就是window對(duì)象

?

圖2:箭頭函數(shù),this指向定義時(shí)對(duì)象,那么由于foo.call 此時(shí)定義時(shí)候this指向了{(lán) id: 42}對(duì)象,所以這里id輸出的是42;====> 箭頭函數(shù)的外層,foo函數(shù)的this就是{ id: 42} 對(duì)象

【小結(jié)】箭頭函數(shù)的this在定義時(shí)所在的對(duì)象,其實(shí)質(zhì)是因?yàn)榧^函數(shù)沒有自己的this,用的是外層的this

【結(jié)尾】普通函數(shù)的this是看的是它執(zhí)行時(shí)候的調(diào)用對(duì)象; 箭頭函數(shù)的this與它的執(zhí)行沒有關(guān)系,在定義的時(shí)候就決定了;

文章版權(quán)歸作者所有,未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址:http://m.specialneedsforspecialkids.com/yun/108797.html

相關(guān)文章

  • 箭頭函數(shù)

    摘要:來看看箭頭函數(shù)的情況可以發(fā)現(xiàn)在定時(shí)器這個(gè)匿名函數(shù)作用域里,所指向的對(duì)象,就是定義時(shí)所指的對(duì)象。對(duì)于構(gòu)造函數(shù)來說,它就是的實(shí)例。如下?lián)耍偨Y(jié)箭頭函數(shù)的三個(gè)優(yōu)點(diǎn)語法簡潔,能夠?qū)懗銎恋膯涡泻瘮?shù)。 ES6新引入了箭頭函數(shù),它是一種表達(dá)簡潔的函數(shù),下面我們來看看它有哪三個(gè)顯著優(yōu)勢。假設(shè)定義了一個(gè)名為names的數(shù)組,如下: showImg(https://segmentfault.com/i...

    NoraXie 評(píng)論0 收藏0
  • 解析jsthis對(duì)象

    摘要:指定為原始值數(shù)字,字符串,布爾值會(huì)指向該原始值的自動(dòng)包裝對(duì)象這一點(diǎn)感謝評(píng)論區(qū)的讀者補(bǔ)充。 前言 (幾天之前寫了源碼分析之后,感覺太疲憊了,寫一些相對(duì)輕巧的內(nèi)容調(diào)劑一下,希望喜歡的同學(xué)可以點(diǎn)個(gè)贊和收藏~)進(jìn)入正題,this對(duì)象在js中是很常見,但是在這里也經(jīng)常會(huì)出錯(cuò),本文將對(duì)常見的this對(duì)象的情況做一些總結(jié) 正文 this對(duì)象是在函數(shù)運(yùn)行時(shí),基于函數(shù)的執(zhí)行環(huán)境綁定的。 其實(shí)這句話的本...

    firim 評(píng)論0 收藏0
  • JS this指向

    摘要:當(dāng)碰到時(shí)呵呵再看一個(gè)呵呵再來呵呵呵呵呵呵呵呵什么意思呢如果返回值是一個(gè)對(duì)象,那么指向的是構(gòu)造函數(shù)的實(shí)例但是并沒有被返回,如果返回值不是一個(gè)對(duì)象那么還是指向構(gòu)造函數(shù)創(chuàng)建的實(shí)例。 為什么要學(xué)習(xí)this?如果你學(xué)過面向?qū)ο缶幊蹋悄憧隙ㄖ栏墒裁从玫模绻銢]有學(xué)過,那么暫時(shí)可以不用看這篇文章,當(dāng)然如果你有興趣也可以看看,畢竟這是js中必須要掌握的東西。 1. this指向調(diào)用他的對(duì)象 首先...

    KavenFan 評(píng)論0 收藏0
  • 你應(yīng)該要知道JSthis

    摘要:在用創(chuàng)建對(duì)象時(shí),指向發(fā)生改變是在第二步創(chuàng)建一個(gè)對(duì)象實(shí)例將構(gòu)造函數(shù)中的指向這個(gè)對(duì)象執(zhí)行構(gòu)造函數(shù)中的代碼返回這個(gè)新創(chuàng)建的對(duì)象箭頭函數(shù)中的箭頭函數(shù)內(nèi)部是不會(huì)綁定的,它會(huì)捕獲外層作用域中的,作為自己的值。參考你不知道的上卷 前言 this 是 JavaScript 中不可不談的一個(gè)知識(shí)點(diǎn),它非常重要但又不容易理解。因?yàn)?JavaScript 中的 this 不同于其他語言。不同場景下的 thi...

    edgardeng 評(píng)論0 收藏0

發(fā)表評(píng)論

0條評(píng)論

最新活動(dòng)
閱讀需要支付1元查看
<