EDUCBA

EDUCBA

MENUMENU
  • Free Tutorials
  • Free Courses
  • Certification Courses
  • 600+ Courses All in One Bundle
  • Login
Home Software Development Software Development Tutorials ES6 Tutorial ES6 Default Parameters
Secondary Sidebar
ES6 Tutorial
  • ES6 Basic and Advance
    • What is ES6
    • ES6 Features
    • ES6 Enum
    • ES6 Array Methods
    • ES6 Spread Operator
    • ES6 Operator
    • ES6 Proxy
    • ES6 New Features
    • ES6 Set
    • ES6 reduce
    • ES6 Destructuring
    • ES6 filter
    • ES6 Cheat Sheet
    • ES6 Template Strings
    • ES6 Generators
    • ES6 Default Parameters
    • ES6 Object Destructuring
    • ES6 Arrow Function
    • ES6 Array
    • ES6 CLASSES
    • ES6 JavaScript
    • ES6 modules

ES6 Default Parameters

ES6 Default Parameters

Definition of ES6 Default Parameters

ES6 default parameters additionally included default settings. If no value is supplied or if undefined is passed, it allows us to set default values for function arguments. To use ES6 default parameter, consider what happens when a function that requires parameters is called with no parameters. It’s vital to remember the parameters are specified in a clockwise direction, as a result, the position of our input value when we call the function will determine whether default values are overwritten. Parameters are what we specify in the function declaration, whereas arguments are what we send to the function.

All in One Software Development Bundle(600+ Courses, 50+ projects)
Python TutorialC SharpJavaJavaScript
C Plus PlusSoftware TestingSQLKali Linux
Price
View Courses
600+ Online Courses | 50+ projects | 3000+ Hours | Verifiable Certificates | Lifetime Access
4.6 (86,130 ratings)

What is ES6 default parameters?

  • The terms “argument” and “parameter” can be used interchangeably at times. Undefined is the default value for a parameter in JavaScript. If we don’t give arguments to the function, its parameters will be undefined by default.
  • The creation of default arguments for functions in JavaScript has been significantly easier using ES6.
  • Now we’ll rewrite the function in ES6 to show how we may provide a default value for parameter.

Default parameter in ES6

  • We can initialize functions with default values using default parameters. When an argument is omitted or undefined, the default is used, which means null is a permissible value.
  • A default parameter can be anything from an integer to an entirely different function.
  • In the below example we have defined simple function name as addition, we have called the same function without assigning any variable values.

Call the function without any parameter values –

As we have seen it is not printing any result in output. It will happen when we have not assigned any variables to function. The below example shows call the function without assigning any variable values to it.

Start Your Free Software Development Course

Web development, programming languages, Software testing & others

Code:

function addition (P, Q)
{
return P + Q;
}
addition ()

1

  • As we can see in the above function we have declared the P and Q variables but we have not assigned any values to them. So it will show an empty result set.

Call the function with parameter values –

  • In the below example we have defined simple function name as addition, we have called the same function by assigning variables and their values.
  • As we have seen it is printing “addition of 6” as a result. The below example shows call the function assigning variables and their values to it.

Code:

function addition (P, Q) {
var Q = (typeof(Q) !== "undefined") ? Q : Q;
return P + Q;
}
addition (4,2)
console.log ("addition is 6")

2

  • In the above example, we have assigned the value of the P variable as 4 and the Q variable as 6 so it will show the result of the P and Q variable as 6.

Define default value to ES6 parameter –

  • If we need to use pre-ES6 capabilities in our application for legacy reasons or browser compatibility, we will have to do something similar to what I’ve outlined. However, ES6 has significantly simplified this process.

The below example is showing that how we can define the default value of ES6 are as follows.

Code:

function getInfo (name = 'ABC', year, color) {
}

3

In the above example function is called with the year and color values as arguments, the arguments will take precedence over the parameters given in the function declaration. This works precisely like the ES5 patterns, but without the extra code. It’s a lot easier to keep track of and read.

Default parameter with omitting values –

The first value will logically be considered to be named. The same would be true if we chose to leave out the second-year argument while keeping the other two.

We can use this feature in the ES6 default parameter, below example shows the default parameter with omitting values are as follows.

Code:

function getInfo (name, year = 1991, color = 'White')
{
console.log (year);
}
getInfo('ABC', null, 'Yellow');

4

  • In the above example, we have left the second argument as blank in this case, which may lead some to believe the year value inside the function should be 1991, which is the default.
  • However, because null is a valid value, this does not occur. This makes sense because the JavaScript engine interprets null as the purposeful lack of an object’s value, but undefined is interpreted as something that happens by chance, according to the specification.

ES6 default parameter values and list of arguments –

  • The arguments object is an array-like object that represents the arguments supplied to a function and is available inside its body.
  • Any changes to the argument values inside the function body are reflected in the arguments object in non-strict mode.

Code:

function getInfo (stud_name, DOB, fav_color) {
console.log (arguments);
}
getInfo('ABC', 1991, 'Pink');

5

  • Changes to the function’s parameters are reflected in the arguments object in the above example.

ES6 default parameter with expressions –

  • The default parameters feature is included an expression that was evaluated to determine the default value, rather than only static values.

Code:

function getAmount() {
return 500;
}
function getInfo (stud_name, Stud_fee = getAmount(), fav_color = name) {
console.log(stud_name, Stud_fee, fav_color)
}
getInfo('ABC');
getInfo('ABC', 500);
getInfo('ABC', 500, 'white');

6

  • In the above example, there are a few things to notice. First, we have used the getAmount () function to assess the second parameter when it isn’t included in the function call.
  • If a second parameter is not provided, this function will be invoked. The second important aspect to note is that we can set a prior parameter as the default for a new parameter. Although we are not sure how useful this would be, it’s useful to know it’s feasible. If the third parameter is not specified, the getInfo () function sets it to the value of the first parameter.
  • We can also provide an existing parameter into a function that will be used as a later parameter since functions can be used to define default parameters.

Conclusion

The creation of default arguments for functions in JavaScript has been significantly easier using ES6. ES6 default parameters additionally included default settings. If no value is supplied or if undefined is passed, it allows us to set default values for function arguments.

Recommended Articles

This is a guide to ES6 default parameters. Here we discuss the definition, What is ES6 default parameters, Example, and Default parameters in ES6. You may also have a look at the following articles to learn more –

  1. ES6 Features
  2. What is ES6?
  3. ES6 vs ES5
  4. ES6 Interview Questions
0 Shares
Share
Tweet
Share
Primary Sidebar
Footer
About Us
  • Blog
  • Who is EDUCBA?
  • Sign Up
  • Live Classes
  • Corporate Training
  • Certificate from Top Institutions
  • Contact Us
  • Verifiable Certificate
  • Reviews
  • Terms and Conditions
  • Privacy Policy
  •  
Apps
  • iPhone & iPad
  • Android
Resources
  • Free Courses
  • Java Tutorials
  • Python Tutorials
  • All Tutorials
Certification Courses
  • All Courses
  • Software Development Course - All in One Bundle
  • Become a Python Developer
  • Java Course
  • Become a Selenium Automation Tester
  • Become an IoT Developer
  • ASP.NET Course
  • VB.NET Course
  • PHP Course

ISO 10004:2018 & ISO 9001:2015 Certified

© 2022 - EDUCBA. ALL RIGHTS RESERVED. THE CERTIFICATION NAMES ARE THE TRADEMARKS OF THEIR RESPECTIVE OWNERS.

EDUCBA
Free Software Development Course

C# Programming, Conditional Constructs, Loops, Arrays, OOPS Concept

*Please provide your correct email id. Login details for this Free course will be emailed to you

By signing up, you agree to our Terms of Use and Privacy Policy.

EDUCBA Login

Forgot Password?

By signing up, you agree to our Terms of Use and Privacy Policy.

EDUCBA
Free Software Development Course

Web development, programming languages, Software testing & others

*Please provide your correct email id. Login details for this Free course will be emailed to you

By signing up, you agree to our Terms of Use and Privacy Policy.

EDUCBA

*Please provide your correct email id. Login details for this Free course will be emailed to you

By signing up, you agree to our Terms of Use and Privacy Policy.

Let’s Get Started

By signing up, you agree to our Terms of Use and Privacy Policy.

This website or its third-party tools use cookies, which are necessary to its functioning and required to achieve the purposes illustrated in the cookie policy. By closing this banner, scrolling this page, clicking a link or continuing to browse otherwise, you agree to our Privacy Policy

Loading . . .
Quiz
Question:

Answer:

Quiz Result
Total QuestionsCorrect AnswersWrong AnswersPercentage

Explore 1000+ varieties of Mock tests View more