Operador ternario JavaScript: dos resultados y valores nulos

Una condición y dos expresiones

El operador condicional elige un resultado según una condición. En una asignación breve evita repetir el nombre de la variable, pero no debería ocultar una secuencia de operaciones.

const unidades = 1;
const etiqueta = unidades === 1 ? 'unidad' : 'unidades';
console.log(etiqueta); // unidad

Para mostrar una categoría, compara el valor que realmente define esa categoría. No utilices la presencia del dato como si demostrara una cantidad positiva: un número negativo también se evalúa como verdadero.

Ausencia y cero

Si buscas un valor alternativo sólo cuando algo es null o undefined, el operador ?? expresa esa regla. || también toma la alternativa con cero, cadena vacía y otros valores falsos.

const stock = 0;
console.log(stock || 10); // 10
console.log(stock ?? 10); // 0
const datos = {};
console.log(datos.limite ?? 5); // 5

Esto no valida el tipo del campo. Si stock contiene la cadena '0', seguirá siendo una cadena. Una decisión sobre inventario, fechas o importes necesita reglas de formato además de una alternativa de presentación.

Cuándo cambiar a if

Los ternarios se asocian hacia la derecha en JavaScript, pero una cadena larga de condiciones puede costar mucho leer. Para clasificar varios estados, escribir un if con nombres o una tabla de correspondencias suele facilitar la revisión. Usa paréntesis cuando la agrupación pueda resultar dudosa.

Casos que cambian la rama

Para una etiqueta singular/plural, prueba cero, uno y dos. Para un campo opcional, prueba ausencia, null, cadena vacía y un cero válido. Así compruebas dos contratos diferentes: cuál es el dato y cómo debe mostrarse.

Si alguna rama causa un efecto, como enviar una petición, la concisión puede esconderlo. Prefiere una instrucción explícita cuando importe distinguir calcular un valor de realizar una operación sobre el servidor.

Referencia 1

Referencia 2