ES6中箭頭函數(shù)的定義與調(diào)用方式詳解
本文主要介紹的是關(guān)于ES6箭頭函數(shù)的定義與調(diào)用方式的相關(guān)內(nèi)容，分享出來供大家參考學(xué)習(xí)，下面來看看詳細(xì)的介紹：
基本用法：
ES6中允許使用“箭頭”(=>)定義函數(shù)
var f = v => v;
上面代碼相當(dāng)于：
var f = function( v ) {
return v;
}
根據(jù)箭頭函數(shù)有參數(shù)和無(wú)參數(shù)來區(qū)分
1、無(wú)參數(shù)的箭頭函數(shù)
var f = () => 5;
等同于
var f = function() { return 5};
2、有參數(shù)的箭頭函數(shù)
var sum = ( a, b) => a + b;
等同于
var sum = function( a, b) {
return a +b;
}
有的函數(shù)體內(nèi)的語(yǔ)句大于一條的話，它的寫法如下使用一個(gè)大括號(hào)將其括起來，并使用return語(yǔ)句返回
var sum = (a, b) => { return a+b;}
由于大括號(hào)被解釋為代碼塊，所以如果箭頭函數(shù)直接返回一個(gè)對(duì)象時(shí)，必須在對(duì)象外面加一個(gè)大括號(hào)
var getFunction = id => ({id: id, anme: "Temp"});
箭頭函數(shù)也可以與變量解構(gòu)結(jié)合使用：
const full = ({first, last}) => first +" "+ last;
等同于
function full(person) {
return person.first +" "+ person.last;
}
使用箭頭函數(shù)可以讓函數(shù)表達(dá)的更加簡(jiǎn)潔
箭頭函數(shù)的一個(gè)用處是簡(jiǎn)化回調(diào)函數(shù)
[1,2,3].map(function(x){
return x*x;
});
使用箭頭函數(shù)的寫法
[1,2,3].map(x => x*x);
另一個(gè)例子
var result = values.sort(function(a, b){
return a -b;
});
箭頭函數(shù)的寫法
var result = values.sort((a, b) => a-b);
使用rest參數(shù)與箭頭函數(shù)結(jié)合的例子
const numbers = (...nums) => nums; numbers(1,2,3,4,5,6,7,8,9); //[1,2,3,4,5,6,7,8,9] //...nums 表示的是一個(gè)數(shù)組 const headAndTail = ( head, ...tail) => [head, tail]; headAndTail(1,2,3,4,5,6,7,8,9);// [1, [2,3,4,5,6,7,8,9]]
使用箭頭函數(shù)注意幾點(diǎn)：
1、函數(shù)體內(nèi)的this對(duì)象就是定義時(shí)所在的對(duì)象，而不是使用時(shí)所在對(duì)象；
2、不可以當(dāng)作構(gòu)造函數(shù)使用，也就是不能用new命令實(shí)例化一個(gè)對(duì)象，否則會(huì)拋出一個(gè)錯(cuò)誤；
3、不可以使用arguments對(duì)象，該對(duì)象在函數(shù)體內(nèi)不存在，如果要用的話，可以用rest參數(shù)代替；
4、不可以使用yield命令，箭頭函數(shù)不能用作Generator函數(shù)；
總結(jié)
以上就是這篇文章的全部?jī)?nèi)容了，希望本文的內(nèi)容對(duì)大家的學(xué)習(xí)或者工作能帶來一定的幫助，如果有疑問大家可以留言交流，謝謝大家對(duì)腳本之家的支持。
相關(guān)文章
若要在使用ajax請(qǐng)求后處理發(fā)送請(qǐng)求返回的結(jié)果，最好使用同步請(qǐng)求，下面為大家介紹下js中同步與異步處理的方法和區(qū)別，感興趣的朋友不要錯(cuò)過2013-12-12
js 第二代身份證號(hào)碼的驗(yàn)證機(jī)制代碼
在盛大某網(wǎng)站注冊(cè)的時(shí)候，身份證必填，但我又不想填真實(shí)身份證號(hào)碼，于是隨便編了串自認(rèn)為合法的身份證號(hào)碼，但是卻馬上被提示號(hào)碼錯(cuò)誤2011-05-05
在瀏覽器中使用JavaScript獲取本機(jī)IP地址是不可行的,因?yàn)闉g覽器的安全策略禁止JavaScript訪問這樣的信息,這篇文章主要給大家介紹了關(guān)于JavaScript獲取本機(jī)IP地址的三種常用方式,需要的朋友可以參考下2023-12-12
window.onload綁定多個(gè)事件的兩種解決方案
這篇文章主要介紹了window.onload綁定多個(gè)事件的兩種解決方案的相關(guān)資料,需要的朋友可以參考下2016-05-05
echarts圖表無(wú)數(shù)據(jù)/空數(shù)據(jù)如何展示"暫無(wú)數(shù)據(jù)"
在開發(fā)echarts的時(shí)候我們不得不考慮數(shù)據(jù)為空的情況,其實(shí)有很多種解決辦法,下面這篇文章主要給大家介紹了關(guān)于echarts圖表無(wú)數(shù)據(jù)/空數(shù)據(jù)如何展示“暫無(wú)數(shù)據(jù)”的相關(guān)資料,需要的朋友可以參考下2022-10-10
JS數(shù)組操作大全對(duì)象數(shù)組根據(jù)某個(gè)相同的字段分組
這篇文章主要介紹了JS數(shù)組操作大全對(duì)象數(shù)組根據(jù)某個(gè)相同的字段分組,需要注意的是，在開發(fā)過程這種數(shù)組的處理函數(shù)，應(yīng)當(dāng)被編寫到項(xiàng)目的公共工具函數(shù)庫(kù)中全局調(diào)用，本文結(jié)合實(shí)例代碼給大家介紹的非常詳細(xì)，需要的朋友可以參考下2022-11-11
輸入框點(diǎn)擊時(shí)邊框變色效果的實(shí)現(xiàn)方法
下面小編就為大家?guī)硪黄斎肟螯c(diǎn)擊時(shí)邊框變色效果的實(shí)現(xiàn)方法。小編覺得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧，祝大家游戲愉快哦2016-12-12
大家都知道，C#中使用的是傳統(tǒng)的類繼承是很簡(jiǎn)單，但在JS中，可就沒這么簡(jiǎn)單了，因?yàn)樗褂玫氖窃?prototype )繼承，實(shí)現(xiàn)起來相對(duì)復(fù)雜了一點(diǎn)。2011-10-10
JS實(shí)現(xiàn)數(shù)組扁平化的方法總結(jié)
數(shù)組扁平化相信不少朋友在一些面試中被問到過,這在我們?nèi)粘＞幊讨幸彩且粋€(gè)常規(guī)操作,它需要我們將一個(gè)多維數(shù)組轉(zhuǎn)化成一個(gè)一維數(shù)組,所以,借著這篇文章,我們今天就一起來匯總一下幾種數(shù)組扁平化的方式,需要的朋友可以參考下2024-02-02
出于瀏覽器的同源策略限制。同源策略是一種約定，它是瀏覽器最核心也最基本的安全功能，如果缺少了同源策略，則瀏覽器的正常功能可能都會(huì)受到影響。知識(shí)點(diǎn)：跨域只會(huì)出現(xiàn)在瀏覽器上，小程序和APP開發(fā)不會(huì)有跨域問題2022-11-11