Qué es y cómo usar el operador ternario en Javascript

El operador ternario ? (también conocido como operador condicional) es una herramienta que nos permite escribir declaraciones condicionales de una manera más concisa y elegante.

Este operador es una forma abreviada de la estructura if...else y es útil cuando queremos tomar decisiones basadas en una condición.

Se compone de tres partes: una expresión condicional, una expresión que se evalúa si la condición es verdadera y otra expresión que se evalúa si la condición es falsa.

La sintaxis básica del operador ternario es la siguiente:

condicion ? expresion_verdadera  : expresion_falsa

Ejemplo básico

Supongamos que queremos escribir un mensaje que sea “Eres mayor de edad” si edad es mayor o igual a 18, y “Eres menor de edad” si edad es menor de 18.

Podríamos escribir el código de la siguiente manera:

const edad = 18;
let mensaje;

if (edad >= 18) {
    mensaje = "Eres mayor de edad";
} else {
    mensaje = "Eres menor de edad";
}

console.log(mensaje); // Resultado: Eres mayor de edad

Sin embargo, utilizando un condicional ternario, podemos simplificar este código en forma más compacta.

const edad = 18;
const mensaje = edad >= 18 ? 'Eres mayor de edad' : 'Eres menor de edad';

console.log(mensaje); // Resultado: Eres mayor de edad

Anidamiento de operadores ternarios

Es posible anidar operadores ternarios para expresiones condicionales más complejas. Por ejemplo,

const calificacion = 80;

const resultadoFinal = calificacion >= 90 ? 'A' :
                       calificacion >= 80 ? 'B' :
                       calificacion >= 70 ? 'C' : 
                                            'D';

console.log(resultadoFinal); // Resultado: B

Ejemplos prácticos

let a = 5;
let b = 8;
let mayor;

if (a > b) {
    mayor = a;
} else {
    mayor = b;
}

let a = 5;
let b = 8;
let mayor = (a > b) ? a : b;

let edad = 20;
let categoria = (edad >= 18) ? "adulto" : "menor de edad";

console.log(`La persona es ${categoria}`);

function obtenerSaludo(esFormal) {
    return esFormal ? "Buenos días, señor(a)" : "Hola";
}

let nombre = usuario ? usuario.nombre : "Invitado";