Ways to Set Default Values in JavaScript

Introduction

Welcome, fellow coders! Today, we're diving into a common challenge in JavaScript – setting default values. We'll explore three nifty ways to tackle this problem. So, let's get started and ensure our code is prepared for any unexpected turns.

1. Using the Logical OR Operator js

Have you ever wished for a magic wand that could assign default values effortlessly? Well, the logical OR operator (||) is pretty close! This operator lets us set a default value if the original value is falsy. Falsy values include undefined, null, 0, false, '' (an empty string), and NaN.

Here's a quick example of how it works:

function greet(name) {
  const defaultName = name || 'Stranger';
  console.log(`Hello, ${defaultName}!`);
}

greet('speaklouder'); // Output: Hello, speaklouder!
greet();        // Output: Hello, Stranger!

In this snippet, if the name parameter is falsy (undefined in the second case), JavaScript sets it to 'Stranger' as the default value. Simple, right?

2. Using the Ternary Operator

If you're a fan of concise and readable code, the ternary operator (? :) is your go-to option. This operator allows you to set a default value based on a condition.

Take a look at this example:

function getDayOfTheWeek(day) {
  const isWeekend = day === 'Saturday' || day === 'Sunday';
  const defaultDay = isWeekend ? 'Relax' : 'Work';
  console.log(`It's time to ${defaultDay}!`);
}

getDayOfTheWeek('Sunday'); // Output: It's time to Relax!
getDayOfTheWeek('Monday'); // Output: It's time to Work!

Here, we use the ternary operator to decide whether to 'Relax' or 'Work' based on the day parameter. It's like choosing your path at a fork in the road.

3. Using ES6 Default Parameters

With the advent of ES6, JavaScript got even more powerful. We can now set default values in javascript, directly in function parameters.

Here's an example:

function orderIceCream(flavor = 'Vanilla', size = 'Regular') {
  console.log(`One ${size} ${flavor} ice cream, please!`);
}

orderIceCream('Chocolate', 'Large'); // Output: One Large Chocolate ice cream, please!
orderIceCream();                     // Output: One Regular Vanilla ice cream, please!

In this snippet, we specify default values for flavor and size right in the function declaration. It's like ordering your favorite ice cream with all the toppings without even asking.

Conclusion

In the ever-evolving world of JavaScript, setting default values is a handy skill to have in your coding toolbox. We've explored three methods to achieve this – the logical OR operator, the ternary operator, and ES6 default parameters. Each method has its own charm, and you can choose the one that fits your coding style.

Read Full Explanation post on topic :set default values

Remember, setting default values ensures that your code is robust and ready to handle any surprises. So, the next time you write JavaScript functions, don't forget to set your defaults, just like setting your GPS destination before embarking on a road trip – it'll make your journey smoother. Happy coding!