JavaScript Rest Parameters: Because Sometimes You Just Need More Args

Ever found yourself writing a function and thinking, “I don’t know how many arguments this will need... maybe 2, maybe 20?” Well, JavaScript has your back with something called rest parameters.

They're like a magic bag that scoops up all the leftover arguments into a neat array.

Let’s dive into what they are, how to use them, and why they’re awesome.

No pizza arguments here—just code.

The Basics

Rest parameters use the ... syntax to gather extra arguments passed to a function into an array.

function sum(...theArgs) {
  let total = 0;
  for (const arg of theArgs) {
    total += arg;
  }
  return total;
}

console.log(sum(1, 2, 3));    // 6
console.log(sum(1, 2, 3, 4)); // 10

You can pass in as many arguments as you like, and the function just gobbles them all up.

Syntax Rules (AKA the Fine Print)

• Only one rest parameter is allowed.
• It must be the last parameter.
• No default values or trailing commas allowed after it.

This is valid:

function logThings(a, b, ...others) {
  console.log(others);
}

This will scream at you:

function wrong1(...one, ...two) {}     
function wrong2(...rest, next) {}      
function wrong3(...stuff,) {}          
function wrong4(...stuff = []) {}      

How It Works

Let’s look at a simple example:

function myFun(a, b, ...manyMoreArgs) {
  console.log("a", a);
  console.log("b", b);
  console.log("manyMoreArgs", manyMoreArgs);
}

myFun("one", "two", "three", "four", "five");

Console output:

a one
b two
manyMoreArgs [ 'three', 'four', 'five' ]

Even if you don’t pass extra values, manyMoreArgs is still a real array:

myFun("one", "two"); 
// manyMoreArgs -> []

Only pass one extra?

myFun("one", "two", "three"); 
// manyMoreArgs -> [ "three" ]

Counting Arguments with Rest

Since rest parameters are just arrays, you can easily use .length:

function fun1(...theArgs) {
  console.log(theArgs.length);
}

fun1();         
fun1(42);       
fun1(1, 2, 3);  

Combine with Regular Params

You can mix normal parameters with rest ones. Example:

function multiply(multiplier, ...theArgs) {
  return theArgs.map((num) => multiplier * num);
}

console.log(multiply(2, 10, 20, 30)); 

Rest vs arguments (Aka The Old Way)

You could use the arguments object… but it's kinda stuck in the past.

function oldWay() {
  const args = Array.from(arguments);
  console.log(args.sort());
}

But arguments is not a real array, so this won’t work:

function nope() {
  arguments.sort();  
}

With rest parameters, you’re already working with a real array:

function sortArgs(...args) {
  return args.sort();
}

console.log(sortArgs(5, 3, 7, 1)); 

Destructuring Rest Params

You can even destructure them, skipping the first few values:

function ignoreFirst(...[, b, c]) {
  return b + c;
}

console.log(ignoreFirst(10, 20, 30)); // 50

TL;DR

✅ Use ...rest when you don’t know how many arguments you’ll get

✅ It's a clean, modern alternative to the arguments object

✅ Works great with array methods like map, sort, forEach

❌ Only one rest param per function

❌ It must come last

I’ve been actively working on a super-convenient tool called LiveAPI.

LiveAPI helps you get all your backend APIs documented in a few minutes

With LiveAPI, you can quickly generate interactive API documentation that allows users to execute APIs directly from the browser.

If you’re tired of manually creating docs for your APIs, this tool might just make your life easier.