Javascript中帶名匿名箭頭函數(shù)的重要區(qū)別(推薦)

1 帶名和匿名函數(shù)的區(qū)別

區(qū)別：匿名函數(shù)需要講地址賦值給另一個變量let a，然后再用a來調(diào)用函數(shù)；而帶名函數(shù)因為顯示地給出了函數(shù)名稱，所以可以直接用這個函數(shù)名稱調(diào)用。

帶名函數(shù)返回值是函數(shù)體內(nèi)的返回值，如abs(x)函數(shù)的返回值是number變量。函數(shù)調(diào)用時，直接abs(6)調(diào)用，這個非常好理解。

function abs(x){
 if(x>=0){
 return x;
 }else{
 return -x;
 }
}

但是匿名函數(shù)呢？如下所示，函數(shù)未顯示地給出一個函數(shù)名稱，但是此處的abs被賦值為這個匿名函數(shù)的地址，所以使用時可以直接用abs(-3)，諸如此類的調(diào)用。

let abs=function(x){
 if(x>=0){
 return x;
 }else{
 return -x;
 }
}

2 箭頭函數(shù)

ES6標(biāo)準(zhǔn)新增了一種新的函數(shù)：Arrow Function（箭頭函數(shù)）。為什么叫Arrow Function？因為它的定義用的就是一個箭頭。箭頭函數(shù)表面上相當(dāng)于匿名函數(shù)，并且簡化了函數(shù)定義。

箭頭函數(shù)有兩種格式，一種是只包含一個表達式，連{ … }和return都省略掉了。

x => x * x

上面的箭頭函數(shù)相當(dāng)于一個匿名函數(shù)“”

function (x) {
 return x * x;
}

還有一種可以包含多條語句，這時候就不能省略{ … }和return：

(x,y) => {
 if (x > 0) {
 return x + y;
 }
 else {
 return -x + y;
 }
}

3 箭頭函數(shù)和匿名函數(shù)的不同

箭頭函數(shù)看上去是匿名函數(shù)的一種簡寫，但實際上，箭頭函數(shù)和匿名函數(shù)有個明顯的區(qū)別：箭頭函數(shù)內(nèi)部的this是詞法作用域，由上下文確定。

調(diào)用函數(shù)obj1.getAge(2017)和調(diào)用obj2.getAge(2017)會得到相同的結(jié)果嗎？

obj1中fn函數(shù)，由于JavaScript函數(shù)對this綁定的錯誤處理，得不到預(yù)期的結(jié)果，this.birth指向window或undefined。

但是obj2，fn函數(shù)是箭頭函數(shù)，箭頭函數(shù)完全修復(fù)了this的指向，this總是指向詞法作用域，也就是外層調(diào)用者obj2。

var obj1 = {
 birth: 1990,
 getAge: function (year) {
 let fn=function(y){
 return y - this.birth; // this指向window或undefined
 };
 return fn(year);
 }
};
var obj2 = {
 birth: 1990,
 getAge: function (year) {
 var fn = (y) => y - this.birth; // this.birth為1990
 return fn(year);
 }
};

4 總結(jié)

和帶名函數(shù)相比，匿名函數(shù)需要講地址賦值給另一個變量let a，然后再用a來調(diào)用函數(shù)；和匿名函數(shù)比，箭頭函數(shù)完全修復(fù)了this的指向，this總是指向詞法作用域。

以上所述是小編給大家介紹的Javascript中 帶名 匿名 箭頭函數(shù)的重要區(qū)別，希望對大家有所幫助，如果有任何疑問歡迎給我留言，小編會及時回復(fù)大家的！

更多Javascript中 帶名 匿名 箭頭函數(shù)的重要區(qū)別(推薦)相關(guān)文章請關(guān)注PHP中文網(wǎng)！

聲明：本網(wǎng)頁內(nèi)容旨在傳播知識，若有侵權(quán)等問題請及時與本網(wǎng)聯(lián)系，我們將在第一時間刪除處理。TEL:177 7030 7066 E-MAIL:11247931@qq.com