成人国产在线小视频_日韩寡妇人妻调教在线播放_色成人www永久在线观看_2018国产精品久久_亚洲欧美高清在线30p_亚洲少妇综合一区_黄色在线播放国产_亚洲另类技巧小说校园_国产主播xx日韩_a级毛片在线免费

資訊專欄INFORMATION COLUMN

javascript 下的 this

Lycheeee / 2979人閱讀

摘要:對(duì)還有開(kāi)玩笑不多說(shuō),這章來(lái)討論一下下的。此前先仔細(xì)體會(huì)這句話永遠(yuǎn)指向的是最后調(diào)用它的對(duì)象。其中調(diào)用的對(duì)象是誰(shuí),所以返回的就是。當(dāng)遇到和例子當(dāng)執(zhí)行的就指向,所以拿到的也是下的和和能改變的指針

javascript 下的 this,讓你猜不透,摸不著,但語(yǔ)法終究有語(yǔ)法的規(guī)范,沒(méi)有莫名的奇妙,只有欠合理的解釋。對(duì)還有 bug ... 開(kāi)玩笑 ^-^///

不多說(shuō),這章來(lái)討論一下 javascript 下的 this 。
此前先仔細(xì)體會(huì)這句話:this永遠(yuǎn)指向的是最后調(diào)用它的對(duì)象。

由于其運(yùn)行期綁定的特性,this的指向在函數(shù)定義的時(shí)候是確定不了的,只有函數(shù)執(zhí)行的時(shí)候才能確定this到底指向誰(shuí)。

window 下的 this:

看幾個(gè)例子來(lái)解釋我上面強(qiáng)調(diào)的那句話:

function a(){
    var num= 233;
    console.log(this.user); //undefined
    console.log(this); //Window
}
a();

運(yùn)行結(jié)果是 this指向的是 window ,所以 this.user 是 undefined,
a() 是 一個(gè)函數(shù)也可以說(shuō)是方法 ,那方法肯定是由對(duì)象來(lái)調(diào)用的。
所以當(dāng)執(zhí)行 a(); 時(shí) 就有一個(gè)隱式對(duì)象調(diào)用了a() ,這個(gè)隱式對(duì)象就是 window

再來(lái)個(gè)例子:

var obj = {
    num: 233,
    getThis:function () {
        return this;
    }
}

console.log(obj.getThis() ); //{ num: 233, getThis: [Function] }

var fun = obj.getThis;
console.log(fun() ); // window

上面是一個(gè)對(duì)象里面有方法屬性;
可以看出 obj.getThis() ;調(diào)用方法會(huì)打印出當(dāng)前對(duì)象(打印日志里面有屬性和方法);
可能大家回想,這不是常理之中嗎,但下面這代碼我只是做了一些賦值結(jié)果怎么就不一樣了呢?

var fun = obj.getThis;
console.log(fun() ); // window

因?yàn)?執(zhí)行fun() 是一個(gè)方法,需要對(duì)象才能調(diào)用方法,而上面執(zhí)行 fun()的對(duì)象是誰(shuí),就是隱式的 window (這句話好像上面第一段代碼說(shuō)過(guò) -_-///),

好了,如果還感覺(jué)有點(diǎn)繞就來(lái)說(shuō)明一下:

this永遠(yuǎn)指向的是最后調(diào)用它的對(duì)象。

obj.getThis() 其中 調(diào)用 getThis() 的 對(duì)象是誰(shuí)? obj,所以 返回的this就是 obj。
console.log( fun() ); 其中 調(diào)用 fun() 的對(duì)象是誰(shuí),沒(méi)誰(shuí)調(diào)用?。?沒(méi)誰(shuí)那就是隱式的 window 啦 ,所以返回的是 window ,看哪個(gè)最后調(diào)用它,那么this就指向那個(gè)。

上面清楚了來(lái)分析下面這段代碼應(yīng)該就容易了:

num_1 = 233;
var obj = {
    num_2: 1111,
    getNum:function () {
        this.num_1 = 666;
        this.fun = function () {
            return this.num_1;
        }
    }
}
obj.getNum();
console.log(obj.fun() ); // 666
var fun = obj.fun;
console.log( fun() ); // 233

先執(zhí)行了 obj.getNum(); 對(duì) getNum() 里面的 屬性和方法進(jìn)行賦值;
接著 執(zhí)行 obj.fun(), 因?yàn)?里面的 this 指向調(diào)用它的 obj,所以 得到num_1 = 666;
再接著執(zhí)行 fun() ,因?yàn)?調(diào)用這方法的是隱式 window ,所以 this.num_1; 就會(huì)找到 在window聲明的遍歷 num_1 = 233;

當(dāng)遇到包含對(duì)象的問(wèn)題:

var obj = {
    a:233,
    obj_2:{
        a:666,
        fn:function(){
            console.log(this.a); // 666 
        }
    } 
}
obj.obj_2.fn();

也很好解釋 ,找到調(diào)用 fn() 函數(shù)的對(duì)象 是 obj_2, 所以 this 指向 obj_2。

當(dāng) this 碰到 return 時(shí):
例子1:

function fun()
{
    this.num= 233;
    return {};
}
var a = new fun();
console.log(a.num); //undefined

例子2:

function fun()
{
    this.num= 233;
    return 11;
}
var a = new fun();
console.log(a.num); //233

總結(jié)一句話 : 如果返回值是一個(gè)對(duì)象,那么this指向的就是那個(gè)返回的對(duì)象,如果返回值不是一個(gè)對(duì)象那么this還是指向函數(shù)的實(shí)例。

當(dāng) this 遇到 apply() 和 call()
例子1 :

function AddNum(a,b){
    this.a = a;
    this.b = b;
    this.fun = function ( ) {
        return this.a + this.b;
    }
}

var obj = new  AddNum(1,2);
console.log(  obj.fun() );  // 3
var obj_2 = {a:2,b:4};
console.log(  obj.fun.call(obj_2) ); // 6

當(dāng)執(zhí)行 obj.fun.call(obj_2); fun() 的this 就指向 obj_2,所以this.a + this.b;拿到的也是 obj_2 下的 a 和 b ;

apply() 和 call() 能 改變 this 的 指針

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

轉(zhuǎn)載請(qǐng)注明本文地址:http://systransis.cn/yun/80283.html

相關(guān)文章

  • 關(guān)于JavaScriptthis的理解

    摘要:想想也是難以置信,這應(yīng)該全歸功于對(duì)框架的依賴,促使助長(zhǎng)了自己對(duì)學(xué)習(xí)的懈怠。真正的成了離職就失業(yè)的尷尬境地。我們接下來(lái)來(lái)了解下中的的使用和作用。以前對(duì)中的理解很簡(jiǎn)單粗暴誰(shuí)調(diào)用就指向誰(shuí)。如果例題中有不對(duì)的地方希望予以指教留言評(píng)論 前言 使用JavaScript有很長(zhǎng)一段時(shí)間了,但是以前過(guò)多都是使用,從不去及理解其中原理,單單只是去生拼硬湊。這樣的開(kāi)發(fā)居然做了2年。匪夷所思居然項(xiàng)目中Java...

    lindroid 評(píng)論0 收藏0
  • JavaScript深入之變量對(duì)象

    摘要:深入系列第四篇,具體講解執(zhí)行上下文中的變量對(duì)象與活動(dòng)對(duì)象。下一篇文章深入之作用域鏈本文相關(guān)鏈接深入之執(zhí)行上下文棧深入系列深入系列目錄地址。 JavaScript深入系列第四篇,具體講解執(zhí)行上下文中的變量對(duì)象與活動(dòng)對(duì)象。全局上下文下的變量對(duì)象是什么?函數(shù)上下文下的活動(dòng)對(duì)象是如何分析和執(zhí)行的?還有兩個(gè)思考題幫你加深印象,快來(lái)看看吧! 前言 在上篇《JavaScript深入之執(zhí)行上下文?!分?..

    Zachary 評(píng)論0 收藏0
  • JavaScript 實(shí)現(xiàn) iOS 下的計(jì)算器

    摘要:最后一次更新于效果演示圖計(jì)算器該項(xiàng)目可在瀏覽器頁(yè)面上實(shí)現(xiàn)計(jì)算器。需要實(shí)現(xiàn)的功能是每當(dāng)用戶點(diǎn)擊按鈕,文本框要實(shí)時(shí)顯示被更新的表達(dá)式。如果當(dāng)前表達(dá)式無(wú)法被計(jì)算,被異常處理捕獲并在文本框顯示。 最后一次更新于2019/07/08 效果演示圖 showImg(https://segmentfault.com/img/bVbuLX9?w=691&h=1073); iOS 計(jì)算器 該項(xiàng)目可在瀏覽器...

    shengguo 評(píng)論0 收藏0
  • JavaScript 實(shí)現(xiàn) iOS 下的計(jì)算器

    摘要:最后一次更新于效果演示圖計(jì)算器該項(xiàng)目可在瀏覽器頁(yè)面上實(shí)現(xiàn)計(jì)算器。需要實(shí)現(xiàn)的功能是每當(dāng)用戶點(diǎn)擊按鈕,文本框要實(shí)時(shí)顯示被更新的表達(dá)式。如果當(dāng)前表達(dá)式無(wú)法被計(jì)算,被異常處理捕獲并在文本框顯示。 最后一次更新于2019/07/08 效果演示圖 showImg(https://segmentfault.com/img/bVbuLX9?w=691&h=1073); iOS 計(jì)算器 該項(xiàng)目可在瀏覽器...

    elisa.yang 評(píng)論0 收藏0
  • JavaScript 實(shí)現(xiàn) iOS 下的計(jì)算器

    摘要:最后一次更新于效果演示圖計(jì)算器該項(xiàng)目可在瀏覽器頁(yè)面上實(shí)現(xiàn)計(jì)算器。需要實(shí)現(xiàn)的功能是每當(dāng)用戶點(diǎn)擊按鈕,文本框要實(shí)時(shí)顯示被更新的表達(dá)式。如果當(dāng)前表達(dá)式無(wú)法被計(jì)算,被異常處理捕獲并在文本框顯示。 最后一次更新于2019/07/08 效果演示圖 showImg(https://segmentfault.com/img/bVbuLX9?w=691&h=1073); iOS 計(jì)算器 該項(xiàng)目可在瀏覽器...

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

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

0條評(píng)論

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