Usage of rest parameter and spread operator in JavaScript?



Rest Parameter

With rest parameter, you can represent a number of arguments as an array. ES6 brought rest parameter to ease the work of developers. For arguments objects, rest parameters are indicated by three dots … and precedes a parameter.

Let’s see the following code snippet to define rest parameter βˆ’

<html>
   <body>
      <script>
         function addition(…numbers) {
            var res = 0;
            numbers.forEach(function (number) {
               res += number;
            });
            return res;
         }
         document.write(addition(3));
         document.write(addition(9,10,11,12,13));
      </script>
   </body>
</html>

Spread Operator

The spread operator will allow you to split an array into single arguments. These arguments are those, which are the functions as separate arguments.

Syntax

Here’s the syntax βˆ’

function myfunction(...iterableObj);

Here’s an example showing Spread Syntax with arguments:

function multiply(x, y) {
   return x*y;
}
var myArgs = [50, 100]; console.log(multiply(…myArgs));

Example

Here’s another example

Live demo

<html>
   <body>
      <script>
         var a, b, c, d, e, f, g;
         a = [10,20];
         b = "rank";
         c = [30, "points"];
         d = "run"

         // concat method.
         e = a.concat(b, c, d);

         // spread operator
         f = [...a, b, ...c, d];
         document.write(e);
         document.write("<br>"+f);
      </script>
   </body>
</html>
Updated on: 2020-06-16T08:08:19+05:30

342 Views

Kickstart Your Career

Get certified by completing the course

Get Started
Advertisements