What Is the Rest Parameter in JavaScript?

The rest parameter syntax in JavaScript allows functions to accept an indefinite number of arguments represented as a standard array. Introduced in ECMAScript 2015 (ES6), this feature simplifies how developers handle variable numbers of function inputs by providing a clean, modern alternative to the legacy arguments object. This article covers the syntax, practical use cases, core rules, and differences between rest parameters and older approaches.

Understanding the Rest Parameter Syntax

The rest parameter is written using three consecutive dots (...) followed by the name of the array that will hold the arguments.

function collectArgs(...args) {
  console.log(args);
}

collectArgs(1, 2, 3, 4); // Output: [1, 2, 3, 4]

When the function is invoked, the rest parameter aggregates all remaining individual arguments into a true JavaScript Array, giving you immediate access to array methods like .map(), .filter(), and .reduce().

Basic Usage and Practical Example

A common use case for rest parameters is creating functions that perform calculations or transformations on an arbitrary number of inputs.

function sumAll(...numbers) {
  return numbers.reduce((total, current) => total + current, 0);
}

console.log(sumAll(5, 10, 15)); // Output: 30
console.log(sumAll(1, 2));       // Output: 3
console.log(sumAll());           // Output: 0

Combining with Regular Parameters

You can combine regular positional parameters with a rest parameter. The rest parameter will collect only the arguments that were not assigned to the preceding parameters.

function formatMessage(sender, prefix, ...messages) {
  return `${sender} (${prefix}): ${messages.join(' ')}`;
}

console.log(formatMessage('Alice', 'Admin', 'Server', 'restarted', 'successfully.'));
// Output: Alice (Admin): Server restarted successfully.

In this example, 'Alice' is assigned to sender, 'Admin' to prefix, and the remaining strings are gathered into the messages array.

Core Rules for Rest Parameters

When working with rest parameters, keep two critical rules in mind:

  1. Must be the last parameter: A function definition can only place the rest parameter at the very end of its parameter list. Placing it before another parameter will throw a SyntaxError.

    // SyntaxError: Rest parameter must be last formal parameter
    function invalid(a, ...b, c) {}
  2. Only one rest parameter per function: A function cannot have multiple rest parameters.

Rest Parameters vs. The arguments Object

Before ES6, handling variable arguments required using the built-in arguments object. Rest parameters are preferred for several reasons: