Operador ternario JavaScript

El operador ternario de JavaScript (y en otros lenguajes de programación) es una forma abreviada de la sentencia if else para tomar una decisión. Usarla nos ayuda a crear código más limpio y fácil de entender y además nos ayuda a escribir código más rápido porque hay menos caracteres que escribir.

Para entenderlo veamos primero la versión larga con un ejemplo en el que vamos a mostrar un mensaje en pantalla diciendo si alguien aprueba o falla un examen basándonos en un puntaje:

let puntaje = 5;
if (puntaje >= 6) {
   alert('Aprobaste');
}
else {
   alert('Fallaste');
}

El resultado del código anterior será: Fallaste. Ahora veamos la versión abreviada:

let puntaje = 5;
alert ( puntaje >= 6 ? 'Pasaste' : 'Fallaste' );

El resultado será el mismo, pero se ve mucho mejor ¿cierto?, pero ahora voy a explicarte todo esto de forma muy sencilla, el operador ternario trabaja de esta forma:

Operador ternario javascript

Se llama ternario porque consta de 3 partes, la primera es la condición, la segunda el valor que regresa si la condición es verdadera y el tercero es el valor que retorna si la condición es falsa.

Ambos valores para falso y verdadero se separan entre ellos con un signo, : mientras en el signo ? se usa para separar la condición de los posibles valores falso y verdadero. Como puedes ver, es muy sencillo.

Usos prácticos del operador ternario.

Ya sabes usar, esté if abreviado, pero veamos algunos ejemplos de la vida real:

Tomar valores predeterminados

Imagina que tienes una variable y en algún momento debes de inicializarla, pero no encontraste un valor inicial, entonces debes protegerte tomando un valor predeterminado, y puedes usar un código como este:

let email;
 
//Ahora, aquí debe ir el código que usas para leer en alguna
//configuración cuál es el email para enviar avisos.
//ese código lo omito para mantener el codigo corto.
 
email = typeof(email) !== 'undefined' ?  email : '[email protected]';

Transformar un valor a otro.

Ahora suponemos que en una variable tienes el código de género (sexo) de una persona, y deseas transformar el código a una descripción que las personas puedan leer de forma natural. Puedes usar un código como este:

let genero; 
// Convertir f a femenino y m a masculino 
genero = 'm'; 
alert( (genero=='m')?'Masculino':'Femenino' )

En este caso la salida será: Masculino

Personalizar una cadena de texto basándose en una variable.

En este ejemplo, vamos a mostrar la decisión que un usuario tomó y que tenemos almacenada en una variable. En este caso usamos el operador ternario para cambiar un valor true/false a si/no

let opcion = true;
let msg;
 
msg = 'Usted ha elegido ' + ((opcion)?'si':'no') + ' recibir notificaciones';
	
alert( msg );

¿Es malo usar el operador ternario?

Hay muchas discusiones y opiniones sobre esto, pero el operador ternario no es un sustituto del if/else.

El objetivo de este operador es mantener el código corto, más fácil de leer y más fácil de escribir, pero si esto se convierte en un código demasiado grande y confuso, entonces considera utilizar la forma larga del if-else.

Por ejemplo, este código funciona y es muy corto, pero también es muy difícil de leer.

int a = b > 10 ? c < 20 ? 50 : 80 : e == 2 ? 4 : 8;

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *