JavaScript Rest parameter

The JavaScript Rest parameter allows a function to accept an indefinite number of arguments as an array. It is represented by three dots (…) followed by the parameter name and must be the last parameter in the function, enabling flexible and dynamic argument handling.

Syntax

//... is the rest parameter (triple dots)
function functionname(...parameters)
{
statement;
}

Note: When … is at the end of the function parameter, it is the rest parameter. It stores n number of parameters as an array. Let’s see how the rest parameter works: 

Let’s see how the rest parameter works.

Example 1: Without Using the Rest Parameter

Javascript code demonstrating the passing arguments more than the parameters without using rest parameter

function fun(a, b){
        return a + b;
    }
    console.log(fun(1, 2)); // 3
    console.log(fun(1, 2, 3, 4, 5)); // 3                

3
3

Explanation: In the above code example

• Extra arguments beyond parameters are ignored without error.
• Use … to collect additional arguments into an array.
• Rest parameters allow flexible argument handling for functions.

Example 2: Using the Rest Parameter

JavaScript code demonstrating the addition of numbers using the rest parameter. 

// es6 rest parameter
function fun(...input) {
    let sum = 0;
    for (let i of input) {
        sum += i;
    }
    return sum;
}
console.log(fun(1, 2)); //3
console.log(fun(1, 2, 3)); //6
console.log(fun(1, 2, 3, 4, 5)); //15                 

3
6
15

We were able to get the sum of all the elements that we enter in the argument when we call the fun() function. We get the sum of all the elements in the array by making use of the for..of loop which is used to traverse the iterable elements inside an array. 

Note: The rest parameter has to be the last argument, as its job is to collect all the remaining arguments into an array. So having a function definition like the code below doesn’t make any sense and will throw an error. 

Example 3: Using Rest Parameter with Other Parameters

In this example, we are using the rest parameter with some other arguments inside a function.

// rest with function and other arguments
function fun(a, b, ...c) {
    console.log(`${a} ${b}`); //Mukul Latiyan
    console.log(c);  //[ 'Lionel', 'Messi', 'Barcelona' ]
    console.log(c[0]); //Lionel
    console.log(c.length); //3
    console.log(c.indexOf('Lionel')); //0
}
fun('Mukul', 'Latiyan', 'Lionel', 'Messi', 'Barcelona');

Mukul Latiyan
[ 'Lionel', 'Messi', 'Barcelona' ]
Lionel
3
0

Explanation:

• The rest parameter collects extra arguments into an array, handling more than the defined parameters.
• In the function, c[0] returns ‘Lionel’ from the rest parameter array.
• The rest parameter is an array, allowing use of standard array methods for further manipulation.

We have a complete list of Javascript Operators, to check those please go through the Javascript Operators Complete Reference article.