Nullish Coalescing Operator ‘

Introduction

The Nullish Coalescing Operator was introduced in ES 2020 and is denoted by two question marks, ‘??’. The Nullish Coalescing operator is used as a logical operator. It accepts two parameters as operands and returns the right operand if the left is either null or undefined, else it returns the left operator. 

 

 

The Nullish Coalescing Operator is a short-circuit operator like ‘||’ and ‘&&.’ 

Let’s observe the use of the operator using a defined example, 

const age = undefined ?? 30;
console.log(age);

 

The above code will display 30 because the left operator is undefined. 

NOTE: 

In the expression a ?? b,

  • If a is either null or undefined, then the result will be b.
  • If a is not null or undefined, then the result will be a.

 

 


Need of Nullish Coalescing Operator

We now know the use of Nullish Coalescing Operator, but you still would be wondering what this operator needs in Js, right?

We got you!

The || (OR) Operator works similarly, but as a developer, we have needed to evaluate our expression when the first operator is either undefined or null. 

The Nullish Coalescing Operator comes into play for the same reason. The operator checks and makes the debugging process of our code a lot easier.

 

As the note above explains, the left operator is checked for the values if it is either undefined or null. The task of this operator is to return the first defined value in the list. 

Chaining with the AND and OR operator

If we try to combine the Nullish Coalescing Operator with the AND and OR operator, it will result in a SyntaxError, like this:

To avoid this error, we can wrap the expression on the left with a pair of parentheses. 

Using the above examples, we can avoid the syntactical error by using the extra pair of parentheses. 

Examples

Let’s go through some examples,. It. to understand more about the Nullish Coalescing Operator. 

let result = undefined ?? "Hello";
console.log(result); // Hello

result = null ?? true
console.log(result); // true

resultfalse ?? true;
console.log(result); // false

result45 ?? true
console.log(result); // 45

result"" ?? true
console.log(result); // ""

resultNaN ?? true
console.log(result); // NaN

result45 ?? true
console.log(result); // false because 45 evaluates to false

result45 ?? true;
console.log(result); // true because 45 evaluates to true

result = [123] ?? true;
console.log(result); // [123]

 

Now, let’s go through some frequently asked questions about the operator. 

Frequently Asked Questions

  1. What is the Nullishh Coalescing Operator?
    Ans: The Nullish Coalescing operator is used as a logical operator and it accepts two parameters as operands and returns the right operand if the left is either null or undefined, else it returns the left operator. 
     
  2. What is the use of the Nullish Coalescing Operator?
    Ans: The Nullish Coalescing Operator is used only when we need to account for the values if they are either null or undefined. 
     
  3.  What difference is between the Nullish Coalescing Operator and the ‘||”(OR) Operator?
    Ans: The critical difference between the Nullish Coalescing Operator and the OR operator is that - the OR operator returns the first truthy value, whereas the Nullish Coalescing Operator returns the first defined value. 

Key Takeaways

Hey everyone, so let’s brief out the article. Let’s discuss in brief whatever we have discussed here. 

  • The Nullish Coalescing operator is used as a logical operator. It accepts two operands and returns the right operand if the left is either null or undefined. Otherwise, it returns the left operator. 
  • The || (OR) Operator works similarly, but as a developer, we have needed to evaluate our expression when the first operator is either undefined or null. 
  • The Nullish Coalescing Operator comes into play for the same reason. The operator checks and makes the debugging process of our code a lot easier. 
  • The article then covers how we can use the AND and the OR operator along with the Nullish Coalescing Operator.

 

Isn’t Web Development engaging? Building new websites and using amazing animations and different APIs, don’t be scared if you cannot grasp the hold of this vast development. We have the perfect web development course for you to make you stand out from your fellow developers. 

 

Happy Learning Ninjas!

 

Was this article helpful ?
0 upvotes

Comments

No comments yet

Be the first to share what you think