箭頭函數(shù)的this指向

raoyi 發(fā)布于2019-08-23 12:00 / 2888人閱讀

摘要：箭頭函數(shù)的指向箭頭函數(shù)的指向的地方并不是函數(shù)調(diào)用的詞法作用域，而是聲明時的詞法作用于。基于這個新的改變，可以看出在改變以往的不合理的地方下足了功夫。試圖希望讓變成一門面向?qū)ο蟮膹娬Z言的決心。

箭頭函數(shù)的this指向 this

箭頭函數(shù)的this指向的地方并不是函數(shù)調(diào)用的詞法作用域，而是聲明時的詞法作用于。詳情請看下例：

var fn = function(){
    console.log(this);
}

var obj = {
    prop : fn
}

obj.prop()  //{prop: ?n}

var fn = () => {
    console.log(this);
}

var obj = {
    prop : fn
}

obj.prop()  //Window

上面兩段代碼中，不同的僅僅是function的聲明方式，一個沿用傳統(tǒng)的function關(guān)鍵字聲明，一個使用了新的 => 箭頭函數(shù)進(jìn)行聲明，然后這兩個this指向的結(jié)果完全不同，一個按照傳統(tǒng)的方式，指向了被調(diào)用的詞法作用域，也就是obj，所以this指向了obj，而另一個則是直接指向了聲明fn方法的詞法作用域，也就是Window。基于這個新的改變，可以看出ES6在改變javascript以往的不合理的地方下足了功夫。試圖希望讓javascript變成一門面向?qū)ο蟮膹娬Z言的決心。

需要注意的地方

基于新特性，以往在使用匿名函數(shù)的時候，不能再隨意使用this了，如：

elem.addEventListener("click",function(){
    //this ==> elem 
},false)

elem.addEventListener("click",() => {
    //this ==> 該代碼的詞法作用域 如 Window 
},false)

這里如果直接按原來的模式將function 替換成 => 的話就會出現(xiàn)上述問題，需要注意。

GPU云服務(wù)器云服務(wù)器 this的指向改變this指向指向函數(shù)的指針箭頭函數(shù)

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

轉(zhuǎn)載請注明本文地址：http://specialneedsforspecialkids.com/yun/97827.html

相關(guān)文章

論普通函數(shù)和箭頭函數(shù)的區(qū)別以及箭頭函數(shù)的注意事項、不適用場景

摘要：第二種情況是箭頭函數(shù)的如果指向普通函數(shù)它的繼承于該普通函數(shù)。箭頭函數(shù)的指向全局，使用會報未聲明的錯誤。 showImg(https://segmentfault.com/img/remote/1460000018610072?w=600&h=400); 箭頭函數(shù)是ES6的API，相信很多人都知道，因為其語法上相對于普通函數(shù)更簡潔，深受大家的喜愛。就是這種我們?nèi)粘ｉ_發(fā)中一直在使用的API...

paulquei 2019-08-23 16:15 評論0 收藏0
ES6精解：箭頭函數(shù)

摘要：基本用法在中允許使用來定義函數(shù)，如下就等同于從上面可以看出，在箭頭左側(cè)的是代表參數(shù)，若參數(shù)只有一個，可以省略，箭頭右側(cè)的表示函數(shù)代碼塊，若代碼塊里面是個返回值，則可以省略不寫無參數(shù)情況若箭頭函數(shù)不需要參數(shù)，則左側(cè)用代替，如下無參數(shù)情況無參數(shù) 基本用法在ES6中允許使用 => 來定義函數(shù)，如下： var f = a => a; console.log(f(1)); //1 就...

HackerShell 2019-08-22 18:18 評論0 收藏0
ES6箭頭函數(shù)體中this指向哪里？

摘要：注意因為箭頭函數(shù)內(nèi)部的是指向外層代碼塊的最近的，例中的函數(shù)的，所以我們可以通過改變外層代碼塊的的指向從而改變箭頭函數(shù)中的指向例中使用了函數(shù)的方法。一、this關(guān)鍵字小測試 ES6箭頭函數(shù)體中的this指向哪里？在回答這個問題之前先來揣揣你對this關(guān)鍵字的了解程度：（讓我們回到ES6之前）題： var obj = { a: function() { cons...

Half 2019-08-22 15:48 評論0 收藏0
ES6 - 箭頭函數(shù)、箭頭函數(shù)與普通函數(shù)的區(qū)別總結(jié)

摘要：但是因為箭頭函數(shù)沒有自己的，它的其實是繼承了外層執(zhí)行環(huán)境中的，且指向永遠(yuǎn)不會隨在哪里調(diào)用被誰調(diào)用而改變，所以箭頭函數(shù)不能作為構(gòu)造函數(shù)使用，或者說構(gòu)造函數(shù)不能定義成箭頭函數(shù)，否則用調(diào)用時會報錯報錯箭頭函數(shù)沒有自己的箭頭函數(shù)沒有自己的對象。這篇文章我們來了解一下ES6中的箭頭函數(shù)。首先會介紹一下箭頭函數(shù)的基本語法，因為基本語法比較好理解，我們用示例做簡單介紹即可。之后，我們重點來討論一下...

scola666 2019-08-23 16:32 評論0 收藏0
es6箭頭函數(shù)

摘要：但是箭頭函數(shù)并沒有自己的其是繼承了外層執(zhí)行環(huán)境的，且不能改變，因此不能作為構(gòu)造函數(shù)，此時，引擎會在報錯。不能作為事件的回調(diào)在中，事件的回調(diào)函數(shù)中，會動態(tài)的指向監(jiān)聽的對象，但是由于監(jiān)聽是一個全局函數(shù)，所以箭頭函數(shù)的回調(diào)中指向。箭頭函數(shù) es6中添加了函數(shù)新的定義語法——箭頭函數(shù)，當(dāng)有大于一個形參的時候，必須使用()代表部分參數(shù)，函數(shù)體大于一行時，必須使用{}將函數(shù)體括起來，并使用ret...

UnixAgain 2019-08-26 10:59 評論0 收藏0
關(guān)于ES6中箭頭函數(shù)的this問題

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

LeviDing 2019-08-22 10:53 評論0 收藏0