How to arguments object with Rest, default, and destructured parameters in JavaScript?

Javascript Web Development Front End Technology

default

This came to handle function parameters with ease. Easily set Default parameters to allow initializing formal parameters with default values. This is possible only if no value or undefined is passed. Let’s see an example

Example

Live Demo

<html>
   <body>
      <script>
         // default is set to 1
         function inc(val1, inc = 1) {
            return val1 + inc;
         }
         document.write(inc(10,10));
         document.write("<br>");
         document.write(inc(10));
      </script>
   </body>
</html>

rest

ES6 brought rest parameter to ease the work of developers. For arguments objects, rest parameters are indicated by three dots … and precedes a parameter.

Example

Let’s see the following code snippet −

<html>
   <body>
      <script>
         function addition(…numbers) {
            var res = 0;
            numbers.forEach(function (number) {
               res += number;
            });
            return res;
         }
         document.write(addition(3));
         document.write(addition(5,6,7,8,9));
      </script>
   </body>
</html>

Destructuring

The parameter introduced in ES6 for binding with pattern matching. If the value is not found, it returns undefined. Let’s see how ES6 allows destructing of arrays into individual variables

Example

Live Demo

<html>
   <body>
      <script>
         let marks = [92, 95, 85];
         let [val1, val2, val3] = marks;

         document.write("Value 1: "+val1);
         document.write("<br>Value 2: "+val2);
         document.write("<br>Value 3: "+val3);
      </script>
   </body>
</html>