JavaScript箭頭函數(shù)是ECMAScript 6中引入的編寫函數(shù)表達(dá)式的一種簡(jiǎn)便方法历筝。通常脓鹃，在JavaScript中奋姿，可以通過(guò)兩種方式創(chuàng)建函數(shù)：
- 函數(shù)語(yǔ)句锄开。
- 函數(shù)表達(dá)式。
可以如下所示創(chuàng)建函數(shù)語(yǔ)句：
function add(num1, num2) {
var res = num1 + num2;
return res;
}
var sum = add(7, 2);
console.log(sum);
也可以創(chuàng)建相同功能的函數(shù)表達(dá)式称诗，如下所示：
var add = function (num1, num2) {
var res = num1 + num2;
return res;
}
var sum = add(7, 2);
console.log(sum);
ECMA 2015（或ECMA Script 6）引入了更短的語(yǔ)法來(lái)編寫函數(shù)表達(dá)式萍悴，稱為箭頭函數(shù)。使用箭頭函數(shù)，你可以將上面的函數(shù)表達(dá)式編寫為：
var add = (num1, num2) => { return num1 + num2; };
正如你所看到的癣诱，使用箭頭函數(shù)編寫的函數(shù)表達(dá)式更短计维。
箭頭函數(shù)的基本語(yǔ)法規(guī)則
首先，參數(shù)應(yīng)該在小括號(hào)中傳遞撕予。你可以創(chuàng)建有兩個(gè)參數(shù)的箭頭函數(shù)鲫惶，如下所示：
ar add = (num1, num2) => { return num1 + num2; };
如果只要傳遞一個(gè)參數(shù)，那么括號(hào)是可選的实抡，可以選擇忽略欠母。你可以創(chuàng)建一個(gè)參數(shù)的箭頭函數(shù)，如下所示：
var add = num => { return num * 10; };
如果沒(méi)有參數(shù)吆寨，那么你必須要有一個(gè)空括號(hào)——不能沒(méi)有赏淌。所以對(duì)于沒(méi)有參數(shù)的函數(shù)，箭頭函數(shù)是這樣寫的：
var add = () => { console.log("hey foo") };
如果函數(shù)中有單個(gè)表達(dá)式或語(yǔ)句：
- 在主體中使用括號(hào)是可選的鸟废。
- 使用return語(yǔ)句是可選的猜敢。
你可以重寫add函數(shù)，而不使用函數(shù)體中的括號(hào)和return語(yǔ)句盒延，如下所示：
var add = (num1, num2) => num1 + num2;
你也可以使用控制臺(tái)語(yǔ)句編寫不帶參數(shù)的函數(shù)缩擂，如下所示：
var add = () => console.log("hey");
返回對(duì)象字面量
JavaScript箭頭函數(shù)也可以返回對(duì)象字面量。唯一的要求是你需要把返回對(duì)象裝入小括號(hào)中添寺，如下所示：
var foo = (name, age) => ({
name: name,
age: age
})
var r = foo("my cat", 22);
console.log(r);
正如你所看到的那樣胯盯，要返回的對(duì)象被放在了小括號(hào)內(nèi)。如果你不這樣做计露，那么JavaScript將無(wú)法區(qū)分對(duì)象字面量和函數(shù)體博脑。
箭頭函數(shù)支持rest參數(shù)
JavaScript箭頭函數(shù)支持另一個(gè)ES6功能：rest參數(shù)。你可以在箭頭函數(shù)中使用rest參數(shù)票罐，如下面的代碼所示：
var add = (num1, num2, ...restparam) => {
console.log(restparam.length);
var result = num1 + num2;
return result;
}
var r = add(67, 8, 90, 23);
console.log(r);
在這個(gè)例子中叉趣，當(dāng)你使用帶有rest參數(shù)的箭頭函數(shù)時(shí)，輸出會(huì)是2和75该押，因?yàn)閭鬟f的額外參數(shù)的數(shù)量是2疗杉，num1和num2的總和是75。
箭頭功能支持默認(rèn)參數(shù)
另外蚕礼，JavaScript箭頭函數(shù)還支持另一個(gè)ES6功能：默認(rèn)參數(shù)烟具。此處詳細(xì)介紹了默認(rèn)參數(shù)。你可以在箭頭函數(shù)中使用默認(rèn)參數(shù)奠蹬，如下所示：
var add = (num1 = 9, num2 = 8) => {
var result = num1 + num2;
return result;
}
var r = add();
console.log(r);
在上面的代碼中朝聋，箭頭函數(shù)中有默認(rèn)參數(shù)。調(diào)用該函數(shù)時(shí)囤躁，我們沒(méi)有傳遞任何值冀痕，并且由于默認(rèn)參數(shù)的存在荔睹，輸出將是17。
“this”在箭頭函數(shù)中如何工作金度？
箭頭函數(shù)沒(méi)有它自己的this值应媚。箭頭函數(shù)中的this值總是從封閉范圍繼承。在JavaScript中猜极，每個(gè)函數(shù)都有它自己的this值中姜，這取決于代碼是如何調(diào)用函數(shù)的。請(qǐng)仔細(xì)看下面列出的代碼：
var Cat = {
name: 'mew',
canRun: function () {
console.log(this)
var foo = () => { console.log(this) }
foo();
}
};
在這里跟伏，cat是一個(gè)對(duì)象字面量丢胚，它包括：
- 屬性名稱。
- 方法canRun受扳。
在canRun方法中携龟，我們創(chuàng)建了一個(gè)箭頭函數(shù)foo，給出了this值勘高。由于箭頭函數(shù)沒(méi)有它自己的this值峡蟋，所以它將從周圍的函數(shù)獲取，因此华望，你將得到：
正如你所看到的蕊蝗，this值在canRun方法和箭頭函數(shù)foo中是相同的。箭頭函數(shù)從繼承范圍得到this值赖舟。如果你對(duì)此不甚清楚蓬戚，那么請(qǐng)牢記以下兩條規(guī)則：
- 使用object.method在方法中獲取一個(gè)有意義的對(duì)象作為this值。
- 對(duì)于任何其他要求宾抓，使用箭頭函數(shù)子漩，由于函數(shù)沒(méi)有自己的this值，所以它將繼承封閉范圍的this值石洗。
使用箭頭函數(shù)的限制條件
應(yīng)用箭頭函數(shù)時(shí)要注意的一些限制條件：
- 箭頭函數(shù)沒(méi)有參數(shù)對(duì)象幢泼。
- 箭頭函數(shù)不能與新運(yùn)算符一起使用，因此它不能用作構(gòu)造函數(shù)讲衫。
- 箭頭函數(shù)沒(méi)有原型屬性缕棵。
如果你嘗試使用箭頭函數(shù)作為構(gòu)造函數(shù)，那么你會(huì)得到異常焦人。請(qǐng)看下面的代碼：
var foo = (name, age) => { name = name, age = age };
var f1 = new foo("cat", 6);
代碼試圖通過(guò)使用箭頭函數(shù)foo作為構(gòu)造函數(shù)來(lái)創(chuàng)建對(duì)象f1，JavaScript將拋出以下異常：
而且重父，當(dāng)你試圖輸出箭頭函數(shù)的原型值時(shí)花椭，你會(huì)得到undefined的輸出：
var foo = (name, age) => { name = name, age = age };
console.log(foo.prototype);
發(fā)生這種情況的原因是因?yàn)榧^函數(shù)沒(méi)有原型屬性。請(qǐng)記追课纭：雖然箭頭函數(shù)為你提供了編寫函數(shù)表達(dá)式的簡(jiǎn)短方法矿辽，但它沒(méi)有自己的this值，也不能用作構(gòu)造函數(shù)。
