What is the ?? Operator in TypeScript (Nullish Coalescing)

Like in JavaScript, the “??” operator in TypeScript is also called the “nullish coalescing operator”. It is similar to the JavaScript “null/nullish coalescing operator”. But the main difference with the JavaScript “??” operator is, it checks for the null and undefined values in a more concise way than using traditional JavaScript expressions.

This post will describe the “??” Operator in TypeScript.

What is the “??” Operator in TypeScript?

The “??” operator is known as the “nullish coalescing operator” in both TypeScript and JavaScript. It is utilized for checking nullish values such as “null” or “undefined” values and outputs a default value if the value is nullish.

Syntax

The following syntax is utilized for the “??” operator in TypeScript:

Here, the “value1” will be checked for nullishness. If it is null or undefined, then, “value2” will be the result. If the “value1” is not null or undefined, then, the result will be “value1”.

Example 1

Here, first, we will create a TypeScript file named “NCOperator.ts” and then, add code to it. We will declare three variables “a”, “b”, and “c” and assign values “null”, “undefined”, and “Linuxhint” respectively:

Now, check the values using the “null coalescing operator” (??). If the variable’s value is null or undefined, the stated operator will output the default value which is value2:

After writing the TypeScript code, open the terminal using the “ctrl+shift+`” and add the given command to transpile the TypeScript code to JavaScript code:

Note: It is mandatory to transpile the TypeScript file after updating the TypeScript code.

The output shows that the first and second log statements print “variable is null or undefined” because the variables “a” and “b” are “null” and “undefined” respectively. While the variable “c” is not null or undefined, so, it displays the variable’s value instead of the default value:

Example 2

In this example, we have two variables “x” and “y” with values “null” and “Linuxhint”:

Now, the “??” operator checks whether the value of “x” is “null” or undefined”. If yes, then, “y” will be the output, otherwise, the output will be “x”:

The output displays the value of “y” that indicates the value of “x” is null or undefined:

Example 3

In the provided example, we will create a function that accepts an optional “name” parameter. Utilize the “??” operator for providing a default value that is “Everyone” when the “name” parameter is undefined means the parameter is not provided to the function:

Call the function with and without the “name” parameter. For the first function call, it will return the default value while in the second function call, it will output the value of the name:

Output

That’s all about the “??” operator in TypeScript.

Conclusion

The “??” or the “null/nullish coalescing operator” is utilized for checking nullish values such as “null” or “undefined” and outputs a default value if the value is nullish. This post described the “??” operator and how to use it in TypeScript.