Operador de coalescencia nula en JavaScript

El operador de coalescencia nula (??) es un operador lógico que permite proporcionar un valor por defecto cuando una expresión es null o undefined.

Este operador, introducido en ECMAScript 2020 (ES11), proporciona una forma más precisa y clara de tratar valores nulos y no definidos (en comparación con otros enfoques tradicionales como usar ||).

El operador coalescencia nula es muy útil para simplificar y mejorar la legibilidad del código cuando trabajamos con valores que contienen null o undefined.

Sintaxis del operador coalescencia nula

La sintaxis del operador de coalescencia nula es simple:

let resultado = valor1 ?? valor2;

En este caso,

• resultado tomará el valor de valor1 si valor1 no es null ni undefined.
• Si valor1 es null o undefined, resultado tomará el valor de valor2.

Por ejemplo, en este caso

let nombreUsuario = usuario.nombre ?? 'Ni idea, oiga';

console.log(nombreUsuario); // 'Ni idea, oiga'

Aquí,

• Si nombre de usuario fuera Pedro, nombreUsuario sería `Pedro.
• Por lo que nombreUsuario toma el valor ‘Ni idea, oiga’.

Combinación con otros operadores

El operador ?? encaja maravillosamente bien (❤️) con otros operadores como el operador de encadenamiento opcional ?..

let nombreUsuario = usuario?.nombre ?? 'Desconocido';
console.log(nombreUsuario); // 'Desconocido'

En este caso se nombreUsuario será ‘Ni idea, oiga’ tanto si,

• usuario es null
• usuario no es null, pero si es null su propiedad nombre

Comparativa con otros métodos de manejo de valores nulos

Condicionales tradicionales

En versiones anteriores de JavaScript, el manejo de valores nulos y no definidos se hacía utilizando condicionales (||).

let nombre = valor || 'Usuario';

Esto es bastante peor, ya que ||considera cualquier valor falsy (como 0, false, '', etc) como una razón para usar el valor por defecto.

Por lo cuál, realmente no responde a undefined o null, ¡si no a un montón de cosas!

Operador Ternario

El operador ternario es otra alternativa para manejar valores nulos. Aunque es menos elegante y puede resultar en código más difícil de leer:

let nombre = (valor !== null && valor !== undefined) ? valor : 'Usuario';

El operador ?? proporciona una forma más concisa y clara de manejar valores nulos y no definidos.