Default Parameters

Default Parameters

A comprehensive guide to Default Parameters in Javascript. Learn about setting default values for function parameters with clear explanations. Perfect for beginners starting with Javascript.

Introduction

As you begin your journey into Javascript, you'll quickly encounter functions and how they accept parameters. But what happens if a function is called without all its parameters? That's where default parameters come in.

In this article, you'll learn how to set default values for function parameters in Javascript. By the end, you'll be able to write more resilient and concise code.

Core Concepts

Default parameters allow you to set a default value for a function parameter if no argument or undefined is passed. Here's a simple example:

function greet(name = 'World') {
  console.log(`Hello, ${name}!`);
}

greet(); // Output: Hello, World!
greet('John'); // Output: Hello, John!

In this greet function, the name parameter has a default value of 'World'. If no argument is passed when calling greet(), it will use the default value. But if an argument is provided, like 'John', that value will be used instead.

Implementation Details

To set a default parameter value, simply assign it in the function declaration:

function myFunction(param1 = defaultValue1, param2 = defaultValue2) {
  // function body
}

You can set default values for any or all parameters. The default value can be a primitive value, an object, or even a function call.

Best Practices

• Only use default parameters when it makes sense. Don't set defaults for required arguments.
• Keep default values simple and predictable. Avoid side effects or expensive computations.
• Consider using default parameters instead of conditionals inside the function body to check for missing arguments.

Common Pitfalls

• Default parameters are evaluated at call time, not declaration time. If you use a function call as a default value, it will be executed every time the function is called without that argument.
• Default parameters are not included in the arguments object. Use a rest parameter if you need to access all arguments.

Practical Examples

Default parameters are handy for setting common configuration options:

function createDiv(height = '100px', width = '100px', border = 'none') {
  // create and return a div with the given specs
}

They can also be used with destructuring to set defaults for object properties:

function drawChart({size = 'medium', coords = {x: 0, y: 0}, radius = 25} = {}) {
  // draw the chart with the given options
}

Summary and Next Steps

Default parameters are a useful feature in Javascript that allow you to write cleaner and more resilient code. They provide a way to set fallback values for arguments that are undefined or not passed.

To dive deeper, you can next explore:

• How default parameters interact with other function features like rest parameters and the arguments object
• Destructuring and object property defaults
• How default parameters work with arrow functions

Armed with this knowledge, you'll be able to leverage default parameters effectively in your own Javascript functions.