Operator (??, ||, !!, ??=, &&=) - Nullish coalesing, logical operator

Operator (??, ||, !!, ??=, &&=) - Nullish coalesing, logical operator

Falsy value

ValueTypeDescription
nullNullThe keyword null — the absence of any value.
undefinedUndefinedunefined — the primitive value.
falseBooleanThe keyword false.
NaNNumberNaN — not a number.
0NumberThe Number, also including 0.0, 0x0, etc.
-0NumberThe Number zero, also including -0.0, -0x0, etc.
0nBigIntThe BigInt, also including 0x0n, etc. Note that there is no BigInt zero — the negation of 0n is 0n.
""StringEmpty string, also including '' and ``.
document.allObjectThe only falsy object in JavaScript is the built-in document.all.

Example

if (false) {
  // Not reachable
}

if (null) {
  // Not reachable
}

if (undefined) {
  // Not reachable
}

if (0) {
  // Not reachable
}

if (-0) {
  // Not reachable
}

if (0n) {
  // Not reachable
}

if (NaN) {
  // Not reachable
}

if ("") {
  // Not reachable
}

|| - or logical

Check variable following the Falsy value

console.log(12 || "not found") // 12
console.log(0  || "not found") // "not found"

console.log("jane" || "not found") // "jane"
console.log(""     || "not found") // "not found"

console.log(true  || "not found") // true
console.log(false || "not found") // "not found"

console.log(undefined || "not found") // "not found"
console.log(null      || "not found") // "not found"

?? - Nullish coalescing

To check if a value is null or undefined, then take the value on the right; otherwise, take the value on the left.

console.log(12 ?? "not found") // 12
console.log(0  ?? "not found") // 0

console.log("jane" ?? "not found") // "jane"
console.log(""     ?? "not found") // ""

console.log(true  ?? "not found") // true
console.log(false ?? "not found") // false

console.log(undefined ?? "not found") // "not found"
console.log(null      ?? "not found") // "not found"

!! - Convert to Boolean

If the value is falsy, it evaluates to false; otherwise, it evaluates to true.

So, !! is not an operator; it's simply the ! operator used twice.

    	 		!!false // false
           !!true // true

              !!0 // false
!!parseInt("foo") // false — NaN is falsy
              !!1 // true
             !!-1 // true  — negative number is truthy
          !!(1/0) // true  — Infinity is truthy

             !!"" // false — empty string is falsy
          !!"foo" // true  — non-empty string is truthy
        !!"false" // true  — ...even if it contains a falsy value

     !!window.foo // false — undefined value is falsy
      !!undefined // false — undefined primitive is falsy
           !!null // false — null is falsy

             !!{} // true  — an (empty) object is truthy
             !![] // true  — an (empty) array is truthy

??= - Nullish coalescing assignment

Assign the right value if the left value is null or undefined

const a = { duration: 50 };

a.duration ??= 10;
console.log(a.duration);
// Expected output: 50

a.speed ??= 25;
console.log(a.speed);
// Expected output: 25

&&= - Logical AND assignment

Assign the value to variable if the right value is Truthy

let a = 1;
let b = 0;

a &&= 2;
console.log(a);
// Expected output: 2

b &&= 2;
console.log(b);
// Expected output: 0

References