Sección 3: JavaScript avanzado

Lección 15: ES8

ES8 introdujo en el 2017 algunas características más. En esta lección cubriremos algunas de ellas. y un par de lecciones más adelante veremos las restantes.

La primera nueva característica que veremos es string padding. Tenemos nuevos métodos que podemos utilizar con strings: padStart y padEnd. Veamos un ejemplo de su uso.

Como podemos, el método padStart añade al inicio del string caracteres en blanco hasta completar el tamaño que le pasamos como argumento. El método padEnd añado al final del string caracteres en blanco hasta completar el tamaño que le pasamos en su argumento. En nuestros ejemplos se añadan 3 caracteres en blanco, ya que el string ‘Tortuga’ posee 7 caracteres.

La siguiente nueva característica aportada por ES8 es lo que se conoce como coma al final de un listado de parámetros en una función. ¿Qué significa esto? Veamos un ejemplo.

Como podemos ver, ahora podemos añadir una coma al final de un listado de parámetros y argumentos.

Vemos que funciona perfectamente. JavaScript permite escribir una coma al final del listado de parámetros y argumentos. ¿Para qué es útil esto? Simplemente para que no arroje error al momento de ejecutar nuestro código.

Veamos la siguiente característica añadida por ES8: Object.values y Object.entries. Son muy útiles, ya antes de estos teníamos Object.keys, el cual nos permitía realizar con objetos las mismas acciones que realizamos con los arrays. Veamos un ejemplo:

Vemos que variable objeto del ejemplo anterior es un objeto y no un array, por lo que no podremos usar los métodos map, filter o reduce, ni tampoco podemos iterar dentro de él. Para hacerlo, primero debemos convertir a nuestro objeto en un array. Para ello utilizaremos primero el método Object.keys. Veámoslo continuando con el ejemplo anterior:

Como podemos ver a través del método keys podemos iterar en objetos. Esa era la forma de hacerlo antes de la llegada de ES8. Con ES8 se planteó una manera más fácil de hacerlo. Veamos un ejemplo.

Vemos como con el método values podemos iterar a través de los valores de los atributos de un objeto. Ahora veamos en un ejemplo el uso del método entries.

Vemos que por cada atributo del objeto, obtenemos un array con dos posiciones, donde la primera posición contiene un string con el nombre del atributo, y la segunda posición contiene un string con el valor del atributo.

Gracias a estos métodos podremos utilizar poderosos métodos de array como map, filter y reduce. Veamos un ejemplo de map, para listar los nombres de usuarios, añadiéndole a cada uno al final su número correspondiente.

Todas estas características de ES8 que vimos son muy útiles, pero existe una nueva característica de ES8 que se ha llevado los aplausos de todos los desarrolladores: Async Await, la cual es una característica avanzada de Javascript que se aprende mejor después de que se comprenda JavaScript asíncrono.

Cubriremos estos temas en la lección 20 de esta sección, titulada “Cómo funciona Javascript”, así como en la sección 2 “HTTP + AJAX + JSON + Javascript asíncrono” del curso de “Desarrollo Web Front End con React y Redux”.

También están las nuevas características de ES9, lanzado en 2018, que requieren un poco más de conocimiento asincrónico de nuestra parte, por lo que estas nuevas características también se presentarán en las lecciones antes mencionadas.

Bueno, eso fue todo por esta lección.

Nos vemos en la siguiente.

¡Adios!