Operador condicional ternario en JavaScript

Por Julio Giampiere Grados Caballero
Operador condicional ternario en JavaScript

En este tutorial aprenderemos a usar uno de los operadores condicionales más sencillos de JavaScript, el operador ternario que te permite evaluar una condición, y ejecutar una de dos instrucciones dependiendo de la condición evaluada.

El operador condicional (ternario) es el único operador en JavaScript que tiene tres operandos. Este operador se usa con frecuencia como atajo para la instrucción if. Siendo un condicional simple que ejecuta una de dos instrucciones posibles dependiendo de la evaluación previa de una condición.

Sintaxis

condición ? expresión1 : expresión2;

Parámetros

  • Condición.- Expresión que se puede evaluar como verdadera o falsa.
  • Expresión 1 y 2.- Expresiones con valores definidos que pueden ejecutarse dependiendo de la condición.

Forma de uso

variable = expresion ? true_value : false_value;

Esto permite básicamente una asignación condicional a una variable en función de la evaluación de la expresión. Si es cierto, entonces true_value se asigna a la variable, caso contrario, entonces false_value se asigna a la variable.

Ejemplos

var max = ( num1 > num2 ) ? num1 : num2 ;

En este ejemplo es , max para ser asignado el número con el valor más alto . La expresión indica que si num1 es mayor que num2, entonces num1 se asigna a max . Si, sin embargo, la expresión es falsa ( lo que significa que num2 es menor o igual a num1 ), a continuación, num2 se asigna a máx .

var miEdad = 24;
var mayorEdad = (miEdad > 18) ? “Sí, eres mayor de edad” : “No, sigue intentando”;

En este segundo ejemplo vemos cómo reconocer un dato si es mayor a 18, y asignar a la variable un string, con dos posibilidades.

var diaFeriado = true;
“Hoy debo pagar ” + ( diaFeriado ? “19 pesos” : “15 pesos”);

En este otro caso evaluamos una expresión booleana, y se obtiene un string el cual posteriormente es concatenado a otro.

Podemos usar también el operador ternario con una estructura más larga.

var a = 11;
var numeroObtenido = a == 5 ? ‘Cinco’ :
                    a == 7 ? ‘Siete’:
                    a == 11 ? ‘Once’:
                    a == 15 ? ‘Quince’:
                    'Otro Número;

console.log( numeroObtenido ); // Once

En este caso, ampliamos el uso del condicional ternario, donde cuando la primera condición evaluada no es verdadera, optamos por establecer una nueva condición y seguir el ciclo anterior.

Por último veremos que en las expresiones a ejecutar también podemos establecer instrucciones más amplias.

var edad = 14;
edad > 18 ? (
alert("Bueno, puedes ingresar.");
window.open(“www.devcode.la”);
) : (
alert("Hey, espera.");
alert("Disculpa, eres menor de edad!");
);

Aquí hemos usado más de una instrucción al evaluar la condición de la variable edad.

Bien en este tutorial hemos aprendido a manejar el operador condicional ternario, que nos permite a evaluar condiciones simples y de manera rápida, te invito a conocer más sobre este operador y otros que cuenta el lenguaje JavaScript en el Curso de JavaScript que tenemos disponible en DevCode, nos leemos en un próximo tutorial.

¿Te gustó el tutorial?

Ayúdanos a llegar a más personas

Julio Giampiere Grados Caballero

Julio Giampiere Grados Caballero

CTO y Cofundador de Devcode.la. Full stack JavaScript. React | jQuery | Vanilla | Backbone | Node | MongoDB.