JavaScript Nullish Coalescing Operator - GeeksforGeeks

11 Sep, 2020
Below is the example of the Nullish Coalescing Operator.
Example:<script>function foo(bar) {    bar = bar ?? 55;    document.write(bar);    document.write("</br>");      }foo();  // 55foo(22); // 22</script>
<script>function foo(bar) {    bar = bar ?? 55;    document.write(bar);    document.write("</br>");      }foo();  // 55foo(22); // 22</script>
Output:55
22
55
22
Nullish Coalescing Operator: It is a new feature introduced in this ECMA proposal has now been adopted into the official JavaScript Specification. This operator returns the right hand value if the left hand value is null or undefined. If not null or undefined then it will return left hand value. Before, setting default values for undefined and null variables required the use of if statement or the Logical OR operator “||” as shown below:
Program:<script>function foo(bar) {    bar = bar || 42;    console.log(bar);}  // Output: 42foo();</script>
<script>function foo(bar) {    bar = bar || 42;    console.log(bar);}  // Output: 42foo();</script>
Output:42
42
When the passed parameter is less than the number of parameters defined in the function prototype, it is assigned the value of undefined. To set default values for the parameters not passed during the function call, or to set default values for fields not present in a JSON object, the above method is popular.
Program:</script>function foo(bar) {    bar = bar || 42;    console.log(bar);}// Output: 42foo(0);</script>
</script>function foo(bar) {    bar = bar || 42;    console.log(bar);}// Output: 42foo(0);</script>
Output:42
42
There are values in JavaScript like 0 and an empty string that are logically false by nature. These values may change the expected behavior of the programs written in JavaScript.
All the reoccurring problems led to the development of the Nullish Coalescing Operator. The Nullish Coalescing Operator is defined by two adjacent question marks ?? and its use is as follows:
Syntax:variable ?? default_value
variable ?? default_value
Examples: If the passed variable is either null or undefined and only if it’s those two values, the default value would be returned. In all other cases including 0, empty string, or false, the value of the variable is returned and not the default value.
Program 1:<script>function foo(bar) {    bar = bar ?? 42;    console.log(bar);}  foo();  // 42foo(0); // 0</script>
<script>function foo(bar) {    bar = bar ?? 42;    console.log(bar);}  foo();  // 42foo(0); // 0</script>
Output:
Program 2: The more common use case is to set default values for JSON objects as follows.<script>const foo = {    bar: 0}  const valueBar = foo.bar ?? 42;const valueBaz = foo.baz ?? 42;  // Value of bar: 0console.log("Value of bar: ", valueBar);  // Value of bar: 42console.log("Value of baz: ", valueBaz);</script>
<script>const foo = {    bar: 0}  const valueBar = foo.bar ?? 42;const valueBaz = foo.baz ?? 42;  // Value of bar: 0console.log("Value of bar: ", valueBar);  // Value of bar: 42console.log("Value of baz: ", valueBaz);</script>
Output:
Supported Browsers: The browsers supported by JavaScript Nullish Coalescing Operator are listed below:
Google Chrome 80
Firefox 72
javascript-operators
JavaScript
Web Technologies
Writing code in comment?
Please use ide.geeksforgeeks.org,
generate link and share the link here.
Remove elements from a JavaScript Array
Convert a string to an integer in JavaScript
Difference between var, let and const keywords in JavaScript
Differences between Functional Components and Class Components in React
How to calculate the number of days between two dates in javascript?
Remove elements from a JavaScript Array
Installation of Node.js on Linux
Convert a string to an integer in JavaScript
How to fetch data from an API in ReactJS ?
How to insert spaces/tabs in text using HTML/CSS?