箭頭函數(shù)中this的問(wèn)題

terasum 發(fā)布于2019-08-22 14:59 / 2277人閱讀

摘要：有人說(shuō)，是中最令人厭煩的風(fēng)格的編程，雖然令人厭煩，但還是要理解且使用它，就像生活一樣，總要做一些自己不喜歡或不擅長(zhǎng)的事。

有人說(shuō)，this是javascript OPP中最令人厭煩的風(fēng)格的編程，
雖然令人厭煩，但還是要理解且使用它，就像生活一樣，總要做一些自己不喜歡或不擅長(zhǎng)的事。

在箭頭函數(shù)出現(xiàn)之前，每個(gè)新定義的函數(shù)都有它自己的this值：
1、在構(gòu)造函數(shù)的情況下，是一個(gè)新的對(duì)象（實(shí)例）；
2、如果該函數(shù)被稱為‘對(duì)象方法’，則為該基礎(chǔ)對(duì)象；
3、如果作為函數(shù)調(diào)用，則指向全局；

function Person() {
  // Person() 構(gòu)造函數(shù)定義 `this`作為它自己的實(shí)例.
  this.age = 0;

  setInterval(function growUp() {
    // 在非嚴(yán)格模式, growUp()函數(shù)定義 `this`作為全局對(duì)象, 
    // 與在 Person()構(gòu)造函數(shù)中定義的 `this`并不相同.
    this.age++;
  }, 1000);
}

var p = new Person();

而箭頭函數(shù)不會(huì)創(chuàng)建自己的this,它使用封閉執(zhí)行上下文的this值，因此，在下面的代碼中，傳遞給setInterval的函數(shù)內(nèi)的this與封閉函數(shù)中的this值相同：

function Person(){
  this.age = 0;

  setInterval(() => {
    this.age++; // |this| 正確地指向person 對(duì)象
  }, 1000);
}

var p = new Person();

云服務(wù)器 GPU云服務(wù)器 js中回調(diào)函數(shù)問(wèn)題箭頭函數(shù) java中this javascript中this詳解

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

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

相關(guān)文章

關(guān)于ES6中箭頭函數(shù)的this問(wèn)題

摘要：對(duì)象的指向是可變的，但是在箭頭函數(shù)中，它是固定的。同樣的由于箭頭函數(shù)沒(méi)有自己的所以傳統(tǒng)的顯性綁定無(wú)效內(nèi)部的指向外部在的學(xué)習(xí)中，的指向問(wèn)題一直是個(gè)難點(diǎn)，特別是在對(duì)象方法中使用時(shí)，必須更加小心。由此箭頭函數(shù)在很大程度上減少了我們的困擾。什么是箭頭函數(shù) 用法 ES6 允許使用箭頭（=>）定義函數(shù) 測(cè)試 var p1 = document.getElementById(test1)...

LeviDing 2019-08-22 10:53 評(píng)論0 收藏0
ES6—箭頭函數(shù)（5）

摘要：因?yàn)樗划a(chǎn)生屬于它自己上下文的箭頭函數(shù)的另一個(gè)用處是簡(jiǎn)化回調(diào)函數(shù)。箭頭函數(shù)使用場(chǎng)景箭頭函數(shù)適合于無(wú)復(fù)雜邏輯或者無(wú)副作用的純函數(shù)場(chǎng)景下，例如用在的回調(diào)函數(shù)定義中，另外目前等庫(kù)，都大量使用箭頭函數(shù)，直接定義的情況已經(jīng)很少了。 0.為什么會(huì)出現(xiàn)箭頭函數(shù)？ 1.傳統(tǒng)的javascript函數(shù)語(yǔ)法并沒(méi)有提供任何的靈活性，每一次你需要定義一個(gè)函數(shù)時(shí)，你都必須輸入function () {},這至少...

yanwei 2019-08-23 17:20 評(píng)論0 收藏0
「前端面試題系列5」ES6 中箭頭函數(shù)的用法

摘要：在這里，如果用箭頭函數(shù)，可以這樣改寫(xiě)箭頭函數(shù)并沒(méi)有自己的，所以事件處理函數(shù)的調(diào)用者并不受影響。比如，在需要?jiǎng)討B(tài)上下文的場(chǎng)景中，使用箭頭函數(shù)需要格外地小心，這些場(chǎng)景包括對(duì)象的方法原型方法事件的回調(diào)構(gòu)造函數(shù)。 showImg(https://segmentfault.com/img/bVboce6?w=1304&h=734); 前言年味兒漸散，收拾下心情，繼續(xù)敲代碼吧。對(duì)于即將到來(lái)金三...

betacat 2019-08-23 15:08 評(píng)論0 收藏0
箭頭函數(shù)中this的指向問(wèn)題

摘要：箭頭函數(shù)中指向等箭頭函數(shù)箭頭函數(shù)的，總是指向定義時(shí)所在的對(duì)象，而不是運(yùn)行時(shí)所在的對(duì)象。關(guān)鍵字通常不能在箭頭函數(shù)中使用除非是嵌套在允許使用的函數(shù)內(nèi)。參考資料的博客可以說(shuō)很厲害了圖解指向什么阮一峰關(guān)于箭頭函數(shù)的討論箭頭函數(shù)中this指向等箭頭函數(shù) javascript this 箭頭函數(shù)的this，總是指向定義時(shí)所在的對(duì)象，而不是運(yùn)行時(shí)所在的對(duì)象。箭頭函數(shù)位于foo函數(shù)內(nèi)部。只有...

DDreach 2019-08-22 13:53 評(píng)論0 收藏0
es6 - 箭頭函數(shù)

摘要：也就是說(shuō)箭頭函數(shù)的的值不再根據(jù)調(diào)用時(shí)上下文確定，而是像普通變量那樣根據(jù)定義時(shí)的作用域鏈進(jìn)行查找。箭頭函數(shù)中的依然要根據(jù)定義時(shí)的作用域鏈進(jìn)行查找。知乎這篇文章對(duì)箭頭函數(shù)的一些不適合的場(chǎng)景進(jìn)行了總結(jié)，可以作為參考。 es6 - 箭頭函數(shù) 哇，箭頭函數(shù)...，聽(tīng)起來(lái)好NB，但是如果你知道它是因?yàn)槭褂昧?>這樣類似箭頭的符號(hào) ，所以才叫箭頭函數(shù)。瞬間感覺(jué)：呵，這名字起的...。 es6增加了...

13651657101 2019-08-26 11:46 評(píng)論0 收藏0
箭頭函數(shù)你想知道的都在這里

摘要：沒(méi)有箭頭函數(shù)沒(méi)有自己的對(duì)象，這不一定是件壞事，因?yàn)榧^函數(shù)可以訪問(wèn)外圍函數(shù)的對(duì)象那如果我們就是要訪問(wèn)箭頭函數(shù)的參數(shù)呢你可以通過(guò)命名參數(shù)或者參數(shù)的形式訪問(wèn)參數(shù)不能通過(guò)關(guān)鍵字調(diào)用函數(shù)有兩個(gè)內(nèi)部方法和。 1、基本語(yǔ)法回顧我們先來(lái)回顧下箭頭函數(shù)的基本語(yǔ)法。ES6 增加了箭頭函數(shù)： var f = v => v; // 等同于 var f = function (v) { return ...

xiaoqibTn 2019-08-23 16:44 評(píng)論0 收藏0