15 JavaScript ES6中的箭頭函數(shù)
-
什么是箭頭函數(shù)
ES6中允許使用=>來(lái)定義函數(shù)。箭頭函數(shù)相當(dāng)于匿名函數(shù)，并簡(jiǎn)化了函數(shù)定義。 -
基本語(yǔ)法
// 箭頭函數(shù)
let fn = (name) => {
// 函數(shù)體
return `Hello ${name} !`;
};
// 等同于
let fn = function (name) {
// 函數(shù)體
return `Hello ${name} !`;
};
箭頭函數(shù)在語(yǔ)法上比普通函數(shù)簡(jiǎn)潔多。箭頭函數(shù)就是采用箭頭=>來(lái)定義函數(shù)，省去關(guān)鍵字function。
函數(shù)的參數(shù)放在=>前面的括號(hào)中，函數(shù)體跟在=>后的花括號(hào)中.
- 箭頭函數(shù)的參數(shù)
如果箭頭函數(shù)沒(méi)有參數(shù)，寫(xiě)空括號(hào)。
//沒(méi)有參數(shù)，寫(xiě)空括號(hào)
let fn = () => {
console.log('hello');
};
如果箭頭函數(shù)有一個(gè)參數(shù)，也可以省去包裹參數(shù)的括號(hào)。
//只有一個(gè)參數(shù)，可以省去參數(shù)括號(hào)
let fn = name => {
console.log(`hello ${name}!`)
};
如果箭頭函數(shù)有多個(gè)參數(shù)，將參數(shù)依次用逗號(hào)(,)分隔，包裹在括號(hào)中。
let fn = (val1, val2, val3, val4) => {
return [val1, val2, val3, val4];
}
- 箭頭函數(shù)的函數(shù)體
如果箭頭函數(shù)的函數(shù)體只有一句執(zhí)行代碼，簡(jiǎn)單返回某個(gè)變量或者返回一個(gè)簡(jiǎn)單的js表達(dá)式，可以省去函數(shù)體花括號(hào){ }。
//返回某個(gè)簡(jiǎn)單變量val
let f = val => val;
// 等同于
let f = function (val) { return val };
//返回一個(gè)簡(jiǎn)單的js表達(dá)式num1+num2
let sum = (num1, num2) => num1 + num2;
// 等同于
let sum = function(num1, num2) {
return num1 + num2;
};
如果箭頭函數(shù)的函數(shù)體只有一句代碼，返回的不是變量和簡(jiǎn)單的js表達(dá)式，而是一個(gè)對(duì)象。
//錯(cuò)誤寫(xiě)法—花括號(hào)會(huì)被解釋為函數(shù)體
let getItem = id => {
id: id,
name: 'gaby'
};
//正確寫(xiě)法
let getItem = id => ({
id: id,
name: 'gaby'
});
如果箭頭函數(shù)的函數(shù)體只有一條語(yǔ)句且不需要返回值（最常用于回調(diào)函數(shù)），加上void關(guān)鍵字文章來(lái)源：http://www.zghlxwxcb.cn/news/detail-664224.html
let fn = () => void doesNotReturn();
箭頭函數(shù)用于回調(diào)函數(shù)文章來(lái)源地址http://www.zghlxwxcb.cn/news/detail-664224.html
//栗子1
//普通函數(shù)
[1, 2, 3].map(function (x) {
return x + x;
});
//ES6箭頭函數(shù)
[1, 2, 3].map(x => x + x);
//栗子2
//普通函數(shù)
var result = [2, 4, 5, 1, 6].sort(function (a, b) {
return a - b;
});
//ES6箭頭函數(shù)
var result = [2, 4, 5, 1, 6].sort((a, b) => a - b);
到了這里，關(guān)于15 JavaScript ES6中的箭頭函數(shù)的文章就介紹完了。如果您還想了解更多內(nèi)容，請(qǐng)?jiān)谟疑辖撬阉鱐OY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章，希望大家以后多多支持TOY模板網(wǎng)！
