Rest parameters in ES6

JavaScript

In this article, we are going to learn about the rest parameters in ES6 Standard of JavaScript that includes how to use with function, array, loop, with no arguments passed to rest parameter.

What is Rest parameters

Rest parameters is a new parameter that was introduced in ES6 use to pass the infinite number of arguments in a function as an array. The last parameter is prefixed with three dots(...). It creates a standard array of user-supplied values.

Syntax

function funname(x, y, ...Args) {
  //code go here
}

Parameter

  • ….Args: – It is the rest parameter that represents we can pass any number of arguments to the function.

Important Note:

  • The only last parameter can be the rest parameters. You can not use it with parameters if it is not the last parameter.
  • Rest parameters is an array we can pass it directly to functions like sort, map & for-each loop.

1.How to Pass a rest parameter to function

In below example, funrest() function’s last parameter ( ...restarg) is prefixed with three dots which is known as rest parameters.

  • The first argument map to x.The second argument map to y.
  • All the arguments after x,y will map to the rest parameter ( ...restarg) , it is an array, User can pass infinite arguments (arg1—-argnth).

JavaScript Program use of Rest Parameter

//Program How to use JS rest parameter

function funrest(x,  y, ...restarg) {
  console.log("x =", x)
  console.log("y =", y)
  console.log("restparameter = ", restparam)
}

funrest("Java", "script", "rest", "parametr", "example", "here")

Output

we can see in the output restparameter = [ ‘rest’, ‘parametr’, ‘example’, ‘here’ ] is an array.

x = Java
y = script
restparameter =  [ 'rest', 'parametr', 'example', 'here' ]

2. Pass Single argument to Rest Parameters

In this example, we have passed a single argument to the rest parameter. If we pass a single argument to rest parameters then also it will return an array. Let us understand this with an example

//Program  to pass a single agrument to JS rest parameter  

function funrest(x,  y, ...restarg) {
  console.log("x =", x)
  console.log("y =", y)
  console.log("restarg= ", restarg)
}

console.log('single argument pass to rest parameters')
funrest("Java", "script", "rest")

Output 

single argument pass to rest parameters
x = Java
y = script
restparameter =  [ 'rest' ]

3. No argument to Rest Parameters

In this example, we have passed no argument to the rest parameter. If we pass no argument to the rest parameter then also it will return an array. Let us understand this with an example

//Program JS rest parameter with no agruments 

function funrest(x,  y, ...restarg) {
  console.log("x =", x)
  console.log("y =", y)
  console.log("restarg= ", restarg)
}
console.log('\n\n no argument pass to rest parameters\n')
funrest("Java", "script")

Output

 no argument pass to rest parameters

x = Java
y = script
restparameter =  []

4.Find Length of Rest parameters

To count the length of the rest parameter operator you can use the .length property as shown in the below example

//Program to get length JS rest parameter

function funrest(...restarg) {
  console.log("size of restarg = ", restarg.length)
}
funrest(1,2,3,4,5,6,7,8,10,11,12)

Output

size of restarg =  11

5. How to use Array method with Rest Parameters

Rest parameters are the standard array of user-supplied values. So we can perform any array operation by using this. Let us understand with an Example

//Program JS rest parameter  with array

function array_reverse(...restArgs) {
  
  let reverseArgs = restArgs.reverse()

   console.log('reverse  array = '+reverseArgs+'\n')
}

array_reverse(1,7,9,6,4)

Output

reverse array  = 4,6,9,7,1

6. For-each loop on Rest Parameters

As we know that Rest parameters are the standard array of user-supplied values. So we can iterate over it using for each loop. Let us consider an example to understand this.

//Program JS rest parameter with for-loop

function array_reverse(...restArgs) {
  
  restArgs.forEach(element => console.log(element));


}
console.log('foreach loop on restargument=');
array_reverse(1,7,9,6)

Output

foreach loop on restargument =
1
7
9
6

Summary :

We have explained the Rest parameters in ES6 with an example. Rest parameters operator is a new parameter that was introduced in ES6 use to pass the infinite number of arguments in a function as an array.

Related Posts