JavaScript Default Parameters

In this tutorial, you will learn about JavaScript default parameters with the assistance of examples.

Introduction

In ECMAScript 2015, default function parameters were introduced to JavaScript language. These allow developers to instate a function with default values if the contentions are not provided to the function call. Introducing function parameters in this manner will make your functions simpler to read and less error-prone and will give default conduct to your functions. This will assist you to avoid mistakes that originate from passing in undefined arguments and destructuring objects that don’t exist.

The default parameter is an approach to set the default values for function parameters a worth is no passed in (ie. it is undefined).

The concept of default parameters is a new feature presented in the ES6 version of JavaScript. This allows us to give default values to work parameters. Let’s take an example,

function sum(x = 3, y = 5) {

    // return sum
    return x + y;
}

console.log(sum(5, 15));  // 20 
console.log(sum(7));        // 12
console.log(sum());          // 8

In the above example, the default value of x is 3 and the default value of y is 5.

• sum(5, 15) – When both arguments are passed, x takes 5 and y takes 15.
• sum(7) – When 7 is passed to the sum() function, x takes 7 and y takes default value 5.
• sum() – When no contention is passed to the sum() function, x takes default value 3 and y takes default value 5.

• 

---

Using Expressions as Default Values

It is likewise conceivable to give expressions as default values.

Example 1: Passing Parameter as Default Values

function sum(x = 1, y = x,  z = x + y) {
    console.log( x + y + z );
}

sum(); // 4

In the above program,

• The default value of x is 1
• The default value of y is set to x parameter
• The default value of z is the sum of x and y

On the off chance that you reference the parameter that has not been instated yet, you will get an error. For instance,

function sum( x = y, y = 1 ) {
    console.log( x + y);
}

sum(); 

Output

ReferenceError: Cannot access 'y' before initialization

---

Example 2: Passing Function Value as Default Value

// using a function in default value expression

const sum = () => 15;

const calculate = function( x, y = x * sum() ) {
    return x + y;
}

const result = calculate(10);
console.log(result);            // 160

In the above program,

• 10 is passed to the calculate() function.
• x becomes 10, and y becomes 150 (the sum function returns 15).
• The result will be 160.

---

Passing undefined Value

In JavaScript, when you pass undefined to a default parameter function, the function takes the default value. For instance,

function test(x = 1) {
  console.log(x);
}

// passing undefined
// takes default value 1
test(undefined); // 1

---

Thanks for reading! We hope you found this tutorial helpful and we would love to hear your feedback in the Comments section below. And show us what you’ve learned by sharing your photos and creative projects with us.

JS ES6