Características novedosas de ES6 que todo desarrollador de JavaScript debe conocer.
Simplificando código de manera más rápida y efectiva con ECMAScript 6.
No cabe duda que JavaScript es un lenguaje impresionante y conforme pasa el tiempo y lo uso a diario mas he notado que se ha venido solidificando con increíbles actualizaciones y nuevas funciones propias o adaptadas de otros lenguajes como Python que nos permiten trabajar de manera más cómoda y eficiente a la hora de codificar en este maravilloso lenguaje.
No omito manifestarles que dentro de estas funcionalidades, existen algunas que necesitan usar dependencias y librerías como Polyfills o incluso transcompiladores como el todopoderoso Babel.JS , esto con el objetivo de asegurarnos que el código está funcionando de la forma que se esperaba sin importar la edad o el tipo de navegador que estemos usando con nuestra app.
Para cualquier developer, todo esto suena muy bien, pero, ¿cuáles son algunas de esas funciones de las que estamos hablando de manera general en este artículo? Bueno veamos algunas de ellas utilizando unos cuantos ejemplos:
1 — SPREAD OPERATOR:
Seria irrisorio no comenzar con esta característica la cual es muy usada sobre todo cuando se trabaja con manejo de estados(state) en ReactJS. Esta funcionalidad nos permite expandir un iterable como por ejemplo una cadena o un arreglo a nuestro antojo, lo cual viene a ser muy útil sobre todo para agregarle nuevos valores al mismo:
2 — TERNARY OPERATOR:
Otra funcionalidad muy útil en ECMAScript es sin duda alguna el Ternary Operator el cual es una forma mas concisa y precisa de un condicional simple del tipo if-else al cual estamos acostumbrados.
Esto es muy ventajoso sobretodo en casos donde tenemos que actualizar valores basados en el cumplimiento de otras condiciones.
Los casos serian diversos, sin embargo podemos dar ejemplos como el caso de React en donde se usa mucho para validar si un object ya existe o si posee la data que se espera tener y que si no es el caso y aun esta vacío presentamos en pantalla un mensaje de “loading….” hasta que logramos que la condición se cumpla para mostrar en pantalla la información o vista necesaria.
Un ejemplo más sencillo para ilustrar esto sería el cálculo de horas extras para un usuario si trabajo más de 40 horas en la semana. Como lograras ver, el ternary es mucho más corto que usar un estándar if/else anidado, también es muy legible lo que hace mas sencillo en proceso de entenderlo.
Como vengo de C# donde generalmente existe esta funcionalidad, lo uso todo el tiempo, especialmente cuando programo JavaScript en React o cuando uso también Python donde existen variaciones de este precioso operador ternario.
3 — TEMPLATE LITERALS:
Esta funcionalidad es una forma de cadena en JavaScript. Cabe mencionar que los elementos que la componen están escritos con comillas inversas (`) en lugar de comillas regulares. Las plantillas literales aceptan expresiones dentro de ellos usando ${expresión} y pueden abarcar varias líneas de ser necesario y no habrá ningún problema puesto que es parte de sus características.
Miremos los siguientes ejemplos de cómo usar esta funcionalidad. No tienen idea de cuanto me encantan los template literals, es algo superpráctico en el moderno universo del next-generation JavaScript.
4 — OPTIONAL CHAINING OPERATOR:
Este operador es realmente increíble, aunque te confieso que he notado que para algunos cuesta un poco adaptarse al mismo al comienzo pero cuando le hayas la lógica y el concepto de forma práctica ya no puedes dejar de usarlo.
Es un operador útil para comprobar si se ha establecido un valor y proceder cuando se compruebe que se ha establecido. Para cuando surgen un sinfín de declaraciones if para verificar si se estableció un valor antes, creo que este operador definitivamente ayudará a solucionarlos de manera mas eficiente.
5 — NULLISH COALESCING OPERATOR:
Es un operador que comprueba si el valor de la izquierda es nulo y, si lo es, entonces devolverá el valor de la derecha. Esto puede resultar muy útil cuando se verifica un valor nulo o se devuelve un mensaje de “Loading…” cuando los valores aún no se han cargado en nuestra app.
Al igual que los anteriores, he tenido el honor de haber aprendido algo de este operador en Python y por esa justa razón encuentro fascinante el poderlo usar en JavaScript porque ahora la sintaxis no me es tan extraña después de todo.
JavaScript como lenguaje se está expandiendo más rápido que nunca. Desde que empecé a aprenderlo de manera profesional, todos los días encuentro formas nuevas e interesantes de solucionar problemas o realizar tareas que son más fáciles de escribir, más rápidas en ejecución, o en algunos casos ambas, o tal vez simplemente extravagantes para alguno que otro developer.
Ahora me toca preguntarte: ¿Habías usado antes algún operador de estos o nunca habías ni siquiera escuchado de ellos? En lo personal desde que los conozco me han encantado y por supuesto que los uso cada vez que tengo una oportunidad hacerlo en el diario vivir de un front end web developer.
Antes de marcharte, Permíteme compartir el código fuente de los ejemplos usados en este articulo contigo para que los puedas usar, modificar, mejorar, comentar o validar si lo ves justo y necesario. Gracias de antemano por tus valiosos aportes o comentarios, todo en pro de mejorar nuestro contenido.
👏 Claps si disfrutaste este articulo, así podré motivarme a escribir mas!
🤔 Comenta si tienes algo que decir, es muy importante saber tu opinión.
🙂 Click en seguir Alvison para que estes al tanto de mis nuevos artículos!
