ES2018, lo último de JavaScript

JavaScript es un lenguage vivo, es más muy vivo diria yo, por este motivo sigue en continua evolución y ofreciendo cada día mejores herramientas a los desarrolladores. Aunque el gran cambio de “standard” fue el de 2015 (ES6), cada año añaden alguna funcionalidad y en concreto las de este año me gustan bastante, sobre todo las que os presento a continuación.

Object Rest/Spread Properties

Para los que conozcan la asignación por “destructuring” de objetos o arrays de ES6, esta nueva opción les hara especial ilusión ya que te facilita mucho el trabajo. Los desarrolladores de React (Native) seguramente lleven usandolo ya algun tiempo para la comunicación entre componentes. Ahora con el ejemplo entenderan perfectamente por que me gusta tanto 🙂.

Copy 
1const input = { a: 1, b: 2, c: 3 }
2const { x, ...y } = input // rest properties
3
4console.log(x) // 1
5console.log(y) // { b: 2, c: 3 }
6
7const input2 = { d: 4, e: 5 }
8const result = { ...input, ...input2 } // spread properties
9console.log(result) // { a: 1, b: 2, c: 3, d: 4, e: 5 }

En el ejemplo podemos observar los parametros rest, que nos permite representar un número indefinido de argumentos y asignarselos a un objeto en este caso. En la parte posterior del ejemplo vemos la utilización del operador de propagación spread, gracias a este operador somos capaces de replicar un objeto o formar uno nuevo a partir de dos o más de manera muy sencilla. Sin duda estas dos propiedades han pasado al top de mis favoritas 🔝.

Iteración asíncrona

Si no estas familiarizado con los iteradores de ES6 (EcmaScript 2015) te pongo en contexto de manera rápida con un sencillo ejemplo. Un iterador es un objeto que tiene el método next() el cual devuelve elemento de una secuencia. Este método devuelve un objeto con dos propiedades: { value, done }. Cuando la invocación de next() regresa un objeto donde la propiedad done es verdadera se considera finalizada la iteración.

Copy 
1const iterable = ['Hola', 'gente']
2const iterator = iterable[Symbol.iterator]()
3
4console.log(iterator.next()) // >> { value: 'Hola', done: false }
5console.log(iterator.next()) // >> { value: 'gente', done: false }
6console.log(iterator.next()) // >> { value: undefined, done: true }
7
8for (let value of iterable) {
9  console.log(value)
10  // >> 'Hola'
11  // >> 'gente'
12}

En el caso de los iteradores asíncrona es exactamente lo mismo que los iteradores normales y corrientes, pero estan pensados para recorrer estructuras de datos asíncronas, por lo que en vez de devolver un objeto con el par {value, done} regresaran una promesa.

Copy 
1const service1 = new Promise(resolve => resolve('Hola'))
2const service2 = new Promise(resolve => resolve('gente'))
3
4async function* asyncIterable (syncIterable) {
5  yield await service1
6  yield await service2
7}
8
9async function getAsyncData () {
10  for await (const x of asyncIterable()) { // for AWAIT of, recordad esto
11    console.log(x)
12  }
13}
14
15getAsyncData()
16// >> Hola
17// >> gente

Como vemos en el ejemplo, también podemos recorrer el iterable asíncrono con un bucle for…of pero en este caso añadiremos await al bucle, de este modo conseguimos una iteración totalmente asíncrona. Esta propiedad resulta extremadamente util para los programadores que usen Node, ya que te facilitan mucho tareas como leer ficheros, etc.

Promise finally

La verdad que el nombre te hace spoiler, porque es realmente descriptivo 😅. Finally es un callback sin valor alguno que se ejecutara al finalizar una promesa, sin importar si se haya completado correctamente (then) o haya capturado algun error (catch). Suele resultar útil para ocultar loading bars o spinners al finalizar el proceso de carga.

Copy 
1fetch('https://blog.jotagep.com/api/posts')
2  .then(res => {
3    processResponse(res)
4  })
5  .catch(err => {
6    handleErrors(err)
7  })
8  .finally(() => {
9    hideLoading()
10  })

Estas son las tres nueva funcionalidades que queria destacar, también quiero resaltar que se han añadido algunas más como tag functions o diversas funciones RegExp, pero por ahora no profundizaremos en estos temas.

Asi que gente os espero en proximos posts y a darle a las teclas, un saludo y paz ✌️.