輕松學(xué)習(xí)JavaScript函數(shù)中的 Rest 參數(shù)
JavaScript函數(shù)可以使用任意數(shù)量的參數(shù)。與其他語言(如C#和Java)不同,你可以在調(diào)用JavaScript函數(shù)時傳遞任意數(shù)量的參數(shù)。JavaScript函數(shù)允許未知數(shù)量的函數(shù)參數(shù)。在ECMAScript 6之前,JavaScript有一個變量來訪問這些未知或可變數(shù)目的參數(shù),這是一個類似數(shù)組的對象,并非一個數(shù)組。細(xì)想以下代碼來理解arguments變量:
function add(){ var result = 0; for(let i=0;i<arguments.length;i++){ result = result + arguments[i]; } return result; } var r = add(6,9,3,2); console.log(r); var t = add(7,56,9); console.log(t);
如你所見,arguments對象用于訪問未知或可變的函數(shù)參數(shù)。即使arguments使用length屬性和方括號,它也不是一個真正的JavaScript數(shù)組。你不能對arguments對象使用其他JavaScript數(shù)組方法,如pop,push,slice等。在使用arguments時存在的一些問題是:
JavaScript函數(shù)arguments對象不是一個真正的JavaScript數(shù)組;因此,你不能使用其他數(shù)組方法,如pop,push,slice等。
在內(nèi)部函數(shù)中訪問外部函數(shù)的arguments對象是很困難的。要訪問的話,你需要在變量中分配外部函數(shù)的arguments函數(shù),然后在內(nèi)部函數(shù)中使用它。
如果你想要使用arguments對象作為數(shù)組,那么你需要通過Aarry.prototype.slice手動轉(zhuǎn)換。
ECMAScript 6引入了一個新功能,Rest參數(shù),它表示一個未知數(shù)量的參數(shù)作為函數(shù)中的一個數(shù)組。它不僅將額外的參數(shù)表示為數(shù)組,還解決了arguments對象的許多問題。使用rest參數(shù)重寫上面的add函數(shù)。
function add(...theArgs){ var result = 0; for(let i=0;i<theArgs.length;i++){ result = result + theArgs[i]; } return result; } var r = add(6,9,3,2); console.log(r); var t = add(7,56,9); console.log(t);
你可以將rest參數(shù)定義為…theArgs或… args。如果最后命名的函數(shù)參數(shù)以…(三個點(diǎn))作為前綴,那么它將成為函數(shù)的rest參數(shù)。JavaScript函數(shù)的rest參數(shù)是純JavaScript數(shù)組。在上面的代碼中,…theArgs是函數(shù)add的rest參數(shù),因?yàn)樗俏ㄒ坏拿麉?shù),且也以…(三個點(diǎn))作為前綴。
由于rest參數(shù)是JavaScript數(shù)組,所以你可以對rest參數(shù)theArgs執(zhí)行諸如push,pop等操作,如下面的代碼所示:
function add(...theArgs){ theArgs.push(10); var result = 0; for(let i=0;i<theArgs.length;i++){ result = result + theArgs[i]; } var lastItem = theArgs.pop(); console.log(lastItem); return result; }
JavaScript函數(shù)的rest參數(shù)也可以與其他參數(shù)一起工作。如果你不想在rest參數(shù)數(shù)組中包含特定參數(shù)的話,那么你可能需要在函數(shù)中使用其他命名參數(shù)。細(xì)想以下代碼塊:
function add(num1, num2, ...theArgs){ console.log(num1); console.log(num2); console.log(theArgs.length); } var r = add(6,9,3,2); var t = add(7,56,9);
對于第一次函數(shù)調(diào)用,6和9將分別分配給num1和num2。對于第二個函數(shù)調(diào)用,7和56將被分配給num1和num2。啟動第三個參數(shù)的參數(shù)將被分配給rest參數(shù)數(shù)組。請記住,前兩個參數(shù)不會成為rest參數(shù)數(shù)組的一部分。所以,如果你打算將所有的值都包含在rest參數(shù)中,那么你應(yīng)該一開始就將它們定義為用逗號分隔的命名參數(shù)。下面給出的代碼將會導(dǎo)致錯誤:
function add(num1, ...theArgs,num2){ console.log(num1); console.log(num2); console.log(theArgs.length); }
在上面的代碼中,rest參數(shù)不是最后一個參數(shù),所以JavaScript會拋出錯誤。rest參數(shù)必須是最后一個正式參數(shù)。
JavaScript允許你破壞rest參數(shù),這意味著你可以將rest變量數(shù)據(jù)解包為不同的變量名稱。請看下面的代碼:
function add(...[a,b,c]){ return a+b+c; } var r = add(6); console.log(r); var t = add(7,56,9); console.log(t);
第一次函數(shù)調(diào)用,將分配a = 6,b = undefined,c = undefined,第二次函數(shù)調(diào)用,將分配a = 7,b = 56,c = 9。在此例子中,函數(shù)將忽略傳遞的任何額外的參數(shù)。
JavaScript函數(shù)的rest參數(shù)是對arguments對象使用函數(shù)未知參數(shù)的一個巨大改進(jìn)。它是一個純JavaScript數(shù)組;因此,你可以對它使用所有數(shù)組方法。你可以將rest變量數(shù)據(jù)解包到命名變量中。你可以給rest參數(shù)指定任何名稱,這又是一個使用arguments關(guān)鍵字的重大改進(jìn)。
英文原文:Easy JavaScript Part 2: What Is the Rest Parameter in a Function?
以上就是本文的全部內(nèi)容,希望對大家的學(xué)習(xí)有所幫助,也希望大家多多支持腳本之家。
相關(guān)文章
淺析函數(shù)聲明和函數(shù)表達(dá)式——函數(shù)聲明的聲明提前
下面小編就為大家?guī)硪黄獪\析函數(shù)聲明和函數(shù)表達(dá)式——函數(shù)聲明的聲明提前。小編覺得挺不錯的,現(xiàn)在分享給大家,也給大家做個參考。2016-05-05JavaScript中的toLocaleDateString()方法使用簡介
這篇文章主要介紹了JavaScript中的toLocaleDateString()方法使用簡介,是JS入門學(xué)習(xí)中的基礎(chǔ)知識,需要的朋友可以參考下2015-06-06深入理解Javascript中的自執(zhí)行匿名函數(shù)
下面小編就為大家?guī)硪黄钊肜斫釰avascript中的自執(zhí)行匿名函數(shù)。小編覺得挺不錯的,現(xiàn)在就分享給大家,也給大家做個參考。一起跟隨小編過來看看吧2016-06-06JavaScript for循環(huán) if判斷語句(學(xué)習(xí)筆記)
下面小編就為大家?guī)硪黄狫avaScript for循環(huán) if判斷語句(學(xué)習(xí)筆記)。小編覺得挺不錯的,現(xiàn)在就分享給大家,也給大家做個參考。一起跟隨小編過來看看吧2017-10-10JavaScript高級程序設(shè)計(第3版)學(xué)習(xí)筆記12 js正則表達(dá)式
前面在分析PhoneGap源碼的時候,曾經(jīng)總結(jié)過一次正則表達(dá)式的用法,為了不同系列文章的完整性,這里將那里的總結(jié)遷移過來2012-10-10Uglifyjs(JS代碼優(yōu)化工具)入門 安裝使用
Uglify JS 是一個服務(wù)端node.js的壓縮程序。需要的朋友可以測試下2012-03-03