El Operador condicional ternario de JavaScript

javascript

El operador condicional (conocido como ternario) es una excelente opción que nos permite ahorrar código y compactar nuestra sintaxis en situaciones que necesitamos abreviar un if/else.

Como docente me ha ocurrido que públicos de diferentes niveles no conocen esta opción y cuando descubren su potencial comienzan a utilizarla a diario.

¿Cómo es su sintaxis básica?

condición a evaluar ? Si es TRUE (similar al IF) : Si es FALSE (como el comportamiento del ELSE)

¿Un ejemplo en la práctica?

var mensaje = (campo_password.length >= 8) ? "La contraseña tiene un longitud válida" : "Error. La contraseña debe tener al menos 8 caracteres";

Para tener en cuenta, y ver las líneas que ahorramos con el operador ternario condicional, si lo armáramos el ejemplo anterior con if/else la estructura podría quedar como la siguiente:

if (campo_password.length >= 8){ 
var mensaje = "La contraseña tiene un longitud válida";}
else{ var mensaje = "Error. La contraseña debe tener al menos 8 caracteres";}

Es importante destacar que este operador puede encadenarse, luego de los : , para tener secuencias de evaluación más largas.

Ya que es una característica que está disponible desde hace años en el estándar ECMAScript, cuenta con una buena compatibilidad en los navegadores modernos. También es importante señalar que ha tenido revisiones en ECMAScript 5.1 (2011) y en ECMAScript 6 (2015).

Más sobre Diseño y desarrollo Web


Acerca de

Autor de los libros: Webmaster Profesional, HTML5: Comprenda el cambio y Apps HTML5 para móviles. Soy especialista en Diseño y Programación Web y Mobile. Colaboré como autor y editor de contenidos para revistas, colecciones y diversos medios digitales. Dicto capacitaciones y consultorías sobre lenguajes y herramientas de desarrollo Web

Deja un comentario

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

*


Cursos y capacitaciones para empresas y profesionales

  • HTML & CSS (maquetado web).
  • CSS3 & Responsive Web Design (diseño web adaptado a móviles y tablets).
  • Flexbox & Grids (técnicas modernas de CSS).
  • LESS & SASS (CSS preprocessors).
  • Responsive E-mail (diseño de emails multidispositivo).
  • Bootstrap (el framework de diseño más utilizado).
  • HTML5 (Nivel inicial y Avanzado + APIs).
  • PhoneGap/Cordova (Aplicaciones para Android e iOS basadas en lenguajes Web).
  • JavaScript (Nivel inicial y avanzado con ECMAScript 6).
  • jQuery (una de las librerías más famosas de JavaScript).
  • Angular (framework para construir aplicaciones Web con JavaScript).
  • PHP & MySQL (programación del lado servidor y bases de datos).

Encontrame en las redes sociales. Contactame.