Nullish Coalescing Operator

El Nullish Coalescing Operator (??) en JavaScript es un operador lógico introducido en ES2020 que permite asignar un valor por defecto a una variable si esta es null o undefined. Es una alternativa más específica y controlada que el operador lógico OR (||), que también asigna valores por defecto, pero considera más valores “falsos”.

---

Sintaxis

let resultado = variable ?? valorPorDefecto;

• Si variable es null o undefined, entonces resultado tomará el valor de valorPorDefecto.
• Si variable tiene cualquier otro valor válido, entonces resultado será igual a variable.

---

Diferencia clave con el operador OR (||)

El operador OR considera todos los valores “falsy” (como 0, -0, '', false, NaN, null, undefined) como desencadenantes para tomar el valor por defecto, mientras que el operador ??solo consideranullyundefined.

Ejemplo comparativo:

let valor1 = 0 || "Por defecto";
console.log(valor1); // Output: 'Por defecto'

let valor2 = 0 ?? "Por defecto";
console.log(valor2); // Output: 0 (porque 0 no es null ni undefined)

---

Casos de uso comunes

1. Asignar valores por defecto controladamente:

let usuario = null;
let nombre = usuario ?? "Invitado";

console.log(nombre); // Output: 'Invitado'

2. Evitar problemas con valores válidos como 0, false, o cadenas vacías (''):

let edad = 0;
let edadMostrada = edad ?? 18;

console.log(edadMostrada); // Output: 0 (porque 0 es un valor válido, no null ni undefined)

3. Con valores undefined o null en configuraciones:

let configuracion = { tema: null };
let tema = configuracion.tema ?? "Oscuro";

console.log(tema); // Output: 'Oscuro' (porque tema es null)

---

Precauciones

• Precedencia de operadores: El operador ?? tiene una precedencia baja, similar al operador lógico OR (||). Si lo usas con otros operadores como && o ||, usa paréntesis para evitar confusiones.

let resultado = false ?? true && 'Texto';
// Esto puede causar confusión. Usa paréntesis para claridad:
let resultadoCorregido = false ?? (true && 'Texto');