1. 程式人生 > 程式設計 >es6函式之rest引數用法例項分析

es6函式之rest引數用法例項分析

本文例項講述了es6函式之rest引數用法。分享給大家供大家參考,具體如下:

es6引入rest引數(形式為 …變數名),用於獲取函式的多餘引數,這樣就不需要使用arguments物件了,rest引數搭配的變數是一個數組,該變數將多餘的引數放入陣列中。

function add (...values) {
 let sum = 0;
 for (var val of values) {
 sum += val
 }
 return sum
}

add(2,3,5) // 10

上面程式碼的add函式是一個求和函式,利用rest引數,可以向該函式傳入任意數目的引數。

下面是一個rest引數代替arguments變數的例子。

// arguments變數的寫法
function sortNumbers() {
 return Array.prototype.slice.call(arguments).sort()
}

// rest引數的寫法
const sortNumbers = (...numbers) => numbers.sort()

上面程式碼的兩種寫法,比較後可以發現,rest引數的寫法更自然也更簡潔。

arguments物件不是陣列,而是一個類似陣列的物件。所以為了使用陣列的方法,必須使用Array.prototype.slice.call先將其轉為陣列。rest引數就不存在這個問題,它就是一個真正的陣列,陣列特有的方法都可以使用。下面是一個利用rest引數改寫陣列push方法的例子。

function push(array,...items) {
 items.forEach(item => {
 array.push(item)
 })
}

var a = []
push(a,1,2,3)

注意,rest引數之後不能再有其他引數(即只能是最後一個引數),否則會報錯

function f (a,...b,c) {
 // ..
} // 報錯

函式的length屬性,不包括rest引數。

(function (a) {}).length // 1
(function (...a) {}).length // 0
(function (a,...b) {}).length // 1

感興趣的朋友可以使用線上HTML/CSS/JavaScript程式碼執行工具:http://tools.jb51.net/code/HtmlJsRun測試上述程式碼執行效果。

更多關於JavaScript相關內容可檢視本站專題:《JavaScript常用函式技巧彙總》、《javascript面向物件入門教程》、《JavaScript錯誤與除錯技巧總結》、《JavaScript資料結構與演算法技巧總結》及《JavaScript數學運算用法總結》

希望本文所述對大家JavaScript程式設計有所幫助。