Default Parameters in JavaScript

In this article, you will be learning about Default Parameters in JavaScript with some examples.

Default parameters in JavaScript allow function parameters to be assigned default values if no value is passed to the function. This can be useful for setting a default behavior for a function or providing a fallback value in case the argument is undefined.

Syntax

In JavaScript, default parameters are set by providing an equal sign (=) followed by the default value for the parameter. For example, the following function has a default parameter x with a value of 10:

function myFunction(x = 10) {
  // function body
}

If a value is not passed to the function for the x parameter, the default value of 10 will be used.

Examples

Here are some examples of how default parameters can be used in JavaScript:

// default parameter for missing arguments
function addNumbers(x = 0, y = 0) {
  return x + y;
}

// x and y are 0, result is 0
console.log(addNumbers());

// x is 5, y is still 0, result is 5
console.log(addNumbers(5));

// x is 5, y is 10, result is 15
console.log(addNumbers(5, 10));

In the above example, the addNumbers function has default parameters for x and y set to 0. If no arguments are passed to the function, or if only one argument is passed, the default value will be used.

// default parameter for undefined values
function printName(firstName, lastName = "Smith") {
  console.log(`${firstName} ${lastName}`);
}

// prints "John Smith"
printName("John");

// prints "Jane Doe"
printName("Jane", "Doe");

In the above example, the printName function has a default parameter for lastName set to "Smith". If no value is passed to the function for the lastName parameter, the default value will be used.

Advantages

There are several advantages to using default parameters in JavaScript:

• They provide a default behavior for a function, which can be useful if the function is often called with missing or undefined arguments.
• They can simplify function calls by allowing you to omit arguments that you don't need to specify.
• They can improve code readability by making it clear what values will be used if no arguments are passed to the function.
• They can provide a fallback value for arguments that may be undefined, which can help prevent errors in your code.

Disadvantages

While default parameters can be useful in many cases, there are also some disadvantages to consider:

• They can make it difficult to understand the expected arguments for a function, especially if the default values are complex or non-obvious.
• They can make it harder to refactor code since changing the default value of a parameter can potentially affect multiple places in your code.
• They can make it more difficult to write unit tests since you need to consider the default values as well as the values you pass to the function.

Wrapping up!

Overall, default parameters can be a useful tool in JavaScript, but it's important to use them carefully and consider their potential drawbacks.

That's all for this article, hope you learned something. Thanks for reading, catch you later.

You can also buy me a coffee that would help me grow as a frontend developer :)

Moazam AliFollow

Frontend Developer who is always passionate in discovering new stuff and building networks.