Nullish Coalescing Assignment (??=) Operator in JavaScript
This is a new operator introduced by javascript. This operator is represented by x ??= y and it is called Logical nullish assignment operator. Only if the value of x is nullish then the value of y will be assigned to x that means if the value of x is null or undefined then the value of y will be assigned to x.
Let’s discuss how this logical nullish assignment operator works. Firstly we all know that logical nullish assignment is represented as x ??= y, this is derived by two operators nullish coalescing operator and assignment operator we can also write it as x ?? (x = y). Now javascript checks the x first, if it is nullish then the value of y will be assigned to x.
Syntax :
x ??= y // Means : x ?? (x = y)
Example 1 :
Javascript
let x = 12; let y = null; let z = 13; // The value of x will become // unchanged because x is not nullish. x ??= z; // The value of y will be // changed because y is nullish. y ??= z; console.log(x) // 12 console.log(y) // 13 |
Output :
12 13
Example 2 :
Javascript
let x = { name : "Ram"} // The value of name will remain // unchanged because x.name is not nullish x.name ??= "Shyam"; // There is no any property named age in object x . // So the value of x.age will be // undefined and undefined means nullish. // that's why the value of age will be assigned. x.age ??= 18; console.log(x.name) // Ram console.log(x.age) // 18 |
Output :
"Ram" 18
Example 3:
HTML
<h1>Hello Geeksforzambiatek</h1> <p id="print_arr"></p> <script> let arr = [1, 2, "apple", null, undefined, []] // Replace each nullish values with "gfg" arr.forEach((item, index)=>{ arr[index] ??= "gfg" }) document.getElementById("print_arr") .innerText = arr.toString(); //console.log(arr) </script> |
Output :
Supported browsers
- Chrome 85
- Edge 85
- Firefox 79
- Safari 14
