箭頭函數(shù)與普通函數(shù)的區(qū)別

ES6標(biāo)準(zhǔn)新增了一種新的函數(shù):Arrow Function(箭頭函數(shù))茬斧。

為什么叫Arrow Function咱旱?因?yàn)樗亩x用的就是一個(gè)箭頭:

x => x * x

上面的箭頭函數(shù)相當(dāng)于:

function (x) {
    return x * x;
}

特點(diǎn)

1.更簡(jiǎn)潔的語法
2.沒有this
3.不能使用new 構(gòu)造函數(shù)
4.不綁定arguments球碉,用rest參數(shù)...解決
5.使用call()和apply()調(diào)用
6.捕獲其所在上下文的 this 值,作為自己的 this 值
7.箭頭函數(shù)沒有原型屬性
8.不能簡(jiǎn)單返回對(duì)象字面量
9.箭頭函數(shù)不能當(dāng)做Generator函數(shù),不能使用yield關(guān)鍵字
10.箭頭函數(shù)不能換行

箭頭函數(shù)相當(dāng)于匿名函數(shù),并且簡(jiǎn)化了函數(shù)定義埋合。箭頭函數(shù)有兩種格式揍异,一種像上面的全陨,只包含一個(gè)表達(dá)式,連{ ... }return都省略掉了衷掷。還有一種可以包含多條語句辱姨,這時(shí)候就不能省略{ ... }return

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

如果參數(shù)不是一個(gè),就需要用括號(hào)()括起來:

// 兩個(gè)參數(shù):
(x, y) => x * x + y * y

// 無參數(shù):
() => 3.14

// 可變參數(shù):
(x, y, ...rest) => {
    var i, sum = x + y;
    for (i=0; i<rest.length; i++) {
        sum += rest[i];
    }
    return sum;
}

如果要返回一個(gè)對(duì)象戚嗅,就要注意雨涛,如果是單表達(dá)式,這么寫的話會(huì)報(bào)錯(cuò):

// SyntaxError:
x => { foo: x }

因?yàn)楹秃瘮?shù)體的{ ... }有語法沖突懦胞,所以要改為:

// ok:
x => ({ foo: x })

this

箭頭函數(shù)看上去是匿名函數(shù)的一種簡(jiǎn)寫替久,但實(shí)際上,箭頭函數(shù)和匿名函數(shù)有個(gè)明顯的區(qū)別:箭頭函數(shù)內(nèi)部的this是詞法作用域躏尉,由上下文確定蚯根。

回顧前面的例子,由于JavaScript函數(shù)對(duì)this綁定的錯(cuò)誤處理胀糜,下面的例子無法得到預(yù)期結(jié)果:

var obj = {
    birth: 1990,
    getAge: function () {
        var b = this.birth; // 1990
        var fn = function () {
            return new Date().getFullYear() - this.birth; // this指向window或undefined
        };
        return fn();
    }
};

現(xiàn)在颅拦,箭頭函數(shù)完全修復(fù)了this的指向蒂誉,this總是指向詞法作用域,也就是外層調(diào)用者obj

var obj = {
    birth: 1990,
    getAge: function () {
        var b = this.birth; // 1990
        var fn = () => new Date().getFullYear() - this.birth; // this指向obj對(duì)象
        return fn();
    }
};
obj.getAge(); // 25

如果使用箭頭函數(shù)距帅,以前的那種hack寫法:

var that = this;

就不再需要了右锨。
由于this在箭頭函數(shù)中已經(jīng)按照詞法作用域綁定了,所以碌秸,用call()或者apply()調(diào)用箭頭函數(shù)時(shí)绍移,無法對(duì)this進(jìn)行綁定,即傳入的第一個(gè)參數(shù)被忽略:

var obj = {
    birth: 1990,
    getAge: function (year) {
        var b = this.birth; // 1990
        var fn = (y) => y - this.birth; // this.birth仍是1990
        return fn.call({birth:2000}, year);
    }
};
obj.getAge(2015); // 25

箭頭函數(shù)沒有原型屬性

var a = ()=>{
  return 1;
}

function b(){
  return 2;
}

console.log(a.prototype);  // undefined
console.log(b.prototype);   // {constructor: ?}
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
  • 序言:七十年代末讥电,一起剝皮案震驚了整個(gè)濱河市蹂窖,隨后出現(xiàn)的幾起案子,更是在濱河造成了極大的恐慌允趟,老刑警劉巖恼策,帶你破解...
    沈念sama閱讀 222,104評(píng)論 6 515
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場(chǎng)離奇詭異潮剪,居然都是意外死亡涣楷,警方通過查閱死者的電腦和手機(jī),發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 94,816評(píng)論 3 399
  • 文/潘曉璐 我一進(jìn)店門抗碰,熙熙樓的掌柜王于貴愁眉苦臉地迎上來狮斗,“玉大人,你說我怎么就攤上這事弧蝇√及” “怎么了?”我有些...
    開封第一講書人閱讀 168,697評(píng)論 0 360
  • 文/不壞的土叔 我叫張陵看疗,是天一觀的道長(zhǎng)沙峻。 經(jīng)常有香客問我,道長(zhǎng)两芳,這世上最難降的妖魔是什么摔寨? 我笑而不...
    開封第一講書人閱讀 59,836評(píng)論 1 298
  • 正文 為了忘掉前任,我火速辦了婚禮怖辆,結(jié)果婚禮上是复,老公的妹妹穿的比我還像新娘。我一直安慰自己竖螃,他們只是感情好淑廊,可當(dāng)我...
    茶點(diǎn)故事閱讀 68,851評(píng)論 6 397
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著特咆,像睡著了一般季惩。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發(fā)上,一...
    開封第一講書人閱讀 52,441評(píng)論 1 310
  • 那天蜀备,我揣著相機(jī)與錄音关摇,去河邊找鬼。 笑死碾阁,一個(gè)胖子當(dāng)著我的面吹牛,可吹牛的內(nèi)容都是我干的些楣。 我是一名探鬼主播脂凶,決...
    沈念sama閱讀 40,992評(píng)論 3 421
  • 文/蒼蘭香墨 我猛地睜開眼,長(zhǎng)吁一口氣:“原來是場(chǎng)噩夢(mèng)啊……” “哼愁茁!你這毒婦竟也來了蚕钦?” 一聲冷哼從身側(cè)響起,我...
    開封第一講書人閱讀 39,899評(píng)論 0 276
  • 序言:老撾萬榮一對(duì)情侶失蹤鹅很,失蹤者是張志新(化名)和其女友劉穎嘶居,沒想到半個(gè)月后,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體促煮,經(jīng)...
    沈念sama閱讀 46,457評(píng)論 1 318
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡邮屁,尸身上長(zhǎng)有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 38,529評(píng)論 3 341
  • 正文 我和宋清朗相戀三年,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了菠齿。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片佑吝。...
    茶點(diǎn)故事閱讀 40,664評(píng)論 1 352
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡,死狀恐怖绳匀,靈堂內(nèi)的尸體忽然破棺而出芋忿,到底是詐尸還是另有隱情,我是刑警寧澤疾棵,帶...
    沈念sama閱讀 36,346評(píng)論 5 350
  • 正文 年R本政府宣布戈钢,位于F島的核電站,受9級(jí)特大地震影響是尔,放射性物質(zhì)發(fā)生泄漏殉了。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 42,025評(píng)論 3 334
  • 文/蒙蒙 一嗜历、第九天 我趴在偏房一處隱蔽的房頂上張望宣渗。 院中可真熱鬧,春花似錦梨州、人聲如沸痕囱。這莊子的主人今日做“春日...
    開封第一講書人閱讀 32,511評(píng)論 0 24
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽鞍恢。三九已至,卻和暖如春,著一層夾襖步出監(jiān)牢的瞬間帮掉,已是汗流浹背弦悉。 一陣腳步聲響...
    開封第一講書人閱讀 33,611評(píng)論 1 272
  • 我被黑心中介騙來泰國(guó)打工, 沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留蟆炊,地道東北人稽莉。 一個(gè)月前我還...
    沈念sama閱讀 49,081評(píng)論 3 377
  • 正文 我出身青樓,卻偏偏與公主長(zhǎng)得像涩搓,于是被迫代替她去往敵國(guó)和親污秆。 傳聞我的和親對(duì)象是個(gè)殘疾皇子,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 45,675評(píng)論 2 359

推薦閱讀更多精彩內(nèi)容