JavaScript Functions
JavaScript rest parameters collect any number of arguments into a single array.
A rest parameter is written with three dots before the name.
It lets one function accept two arguments, or ten, without changing the definition.
Example
javascript
function addAll(...numbers) {
let total = 0;
for (const n of numbers) {
total += n;
}
return total;
}
console.log(addAll(1, 2, 3, 4));Here, all four arguments are collected into an array called numbers.
The output is 10.
A rest parameter gathers the remaining arguments into a real array.
Because it is a real array, you can use array methods on it directly.
There can only be one rest parameter, and it must be last.
Syntax
javascript
function name(...values) {
// values is an array
}The three dots must come immediately before the parameter name.
Named parameters come first, and the rest parameter picks up whatever is left.
Example
javascript
function report(title, ...scores) {
return title + ": " + scores.length + " scores";
}
console.log(report("Maths", 80, 90, 75));Here, title takes the first argument and the rest go into the array.
A rest parameter has to be the final parameter.
Putting anything after it is a syntax error, because there would be nothing left to collect.
Example
javascript
function valid(first, ...others) {
return first + " then " + others.join(", ");
}
console.log(valid("a", "b", "c"));This works because the rest parameter is at the end.
The collected values behave like any other array.
Example
javascript
function largest(...numbers) {
return Math.max(...numbers);
}
console.log(largest(5, 12, 8, 44));Here, the array is collected and then spread back out into Math.max.
Three dots in a function definition collect values together.
Three dots in a function call spread values apart.
Example
javascript
function show(...items) {
return items.length;
}
const list = [1, 2, 3];
console.log(show(...list));The call spreads the array into three arguments, and the definition collects them again.
If no extra arguments are passed, the rest parameter is an empty array.
Example
javascript
function count(...items) {
return items.length;
}
console.log(count());The output is 0, not undefined, which makes it safe to loop over.
Complete Example
html
<!DOCTYPE html>
<html>
<head>
<title>JavaScript Rest Parameters</title>
</head>
<body>
<h1>JavaScript Rest Parameters</h1>
<p id="result"></p>
<script>
function addAll(...numbers) {
let total = 0;
for (const n of numbers) {
total += n;
}
return total;
}
document.getElementById("result").innerHTML =
"Total: " + addAll(5, 10, 15, 20);
</script>
</body>
</html>Run the above example in the Try It Editor.
Try adding more numbers:
Pass six numbers to addAll without changing the function.
undefined.JavaScript rest parameters let a function accept any number of arguments.
Because the result is a real array, every array method is available immediately.
Understanding rest parameters helps you write flexible, reusable functions.