Operador ternario

Si has visto el tema donde hablamos de los condicionales if/else, habrás visto la forma más habitual de establecer condiciones en un programa. Sin embargo, existe una forma alternativa y compacta de escribir una condición, haciendo uso del operador ternario.

El operador ternario es una alternativa al condicional if/else de una forma mucho más compacta y breve, que en muchos casos resulta más legible. Sin embargo, hay que tener cuidado, porque su sobreutilización puede ser contraproducente y producir un código más difícil de leer.

La sintaxis de un operador ternario es la siguiente:

condición ? valor verdadero : valor falso;

Para entenderlo bien, vamos a reescribir el ejemplo de los temas anteriores utilizando este operador ternario. Primero, recordemos el ejemplo utilizando estructuras if/else:

let nota = 7;
console.log("He realizado mi examen. Mi resultado es el siguiente:");

if (nota < 5) {
  // Acción A: nota es menor que 5
  calificacion = "suspendido";
} else {
  // Acción B: Cualquier otro caso diferente a A (nota es mayor o igual que 5)
  calificacion = "aprobado";
}

console.log("Estoy", calificacion);

Ahora, vamos a reescribirlo utilizando un operador ternario:

let nota = 7;
console.log("He realizado mi examen. Mi resultado es el siguiente:");

// Operador ternario: (condición ? verdadero : falso)
let calificacion = nota < 5 ? "suspendido" : "aprobado";

console.log("Estoy", calificacion);

Repasemos el ejemplo:

Observa que guardamos en calificacion el resultado del operador ternario.
La condición es nota < 5, se escribe al principio, previo al ?.
Si la condición es cierta, el ternario devuelve "suspendido".
Si la condición es falsa, el ternario devuelve "aprobado".

Este ejemplo hace exactamente lo mismo que el ejemplo anterior del if/else. La idea del operador ternario es que podemos condensar mucho código y tener un if en una sola línea. Es muy práctico, legible e ideal para ejemplos pequeños donde almacenamos la información en una variable para luego utilizarla.

Operador ternario anidado

Sin embargo, hay que tener cuidado, ya que los operadores ternarios sólo se recomiendan cuando se trata de if muy pequeños. Si intentasemos realizar una comprobación de if múltiples con el operador ternario, la sintaxis puede resultar compleja y difícil de leer. Observa el siguiente ejemplo con múltiples if / else:

let nota = 7;
console.log("He realizado mi examen.");

if (nota < 5) {
  calificacion = "Insuficiente";
} else if (nota < 6) {
  calificación = "Suficiente";
} else if (nota < 8) {
  calificacion = "Bien";
} else if (nota <= 9) {
  calificacion = "Notable";
} else {
  calificacion = "Sobresaliente";
}

console.log("He obtenido un", calificacion);

Vamos a trasladarlo a un nuevo ejemplo utilizando operadores ternarios anidados:

let nota = 7;
console.log("He realizado mi examen.");

let calificacion =
  nota < 5 ? "Insuficiente" :
  nota < 6 ? "Suficiente" :
  nota < 8 ? "Bien" :
  nota <= 9 ? "Notable" :
  "Sobresaliente";

console.log("He obtenido un", calificacion);

Observa que lo que tenemos en este ejemplo son múltiples operadores ternarios anidados uno dentro de otro. El "valor falso" del primer operador ternario, es un nuevo operador ternario, que a su vez su valor falso es un nuevo operador ternario, y así con varios casos más.

Aunque en principio puede resultar interesante porque es bastante compacto y se escribe poco código, se trata de una estructura y sintaxis extraña, por lo que recuerda que los operadores ternarios anidados no suelen estar muy bien vistos.