Funciones async/await en Javascript⏳
¿Conocen el Callback Hell? Para evitarlo existen las funciones async/await, que ejecutan secuencias con una buena estructura de sintaxis. A continuación les explicaré la historia de las funciones asíncronas y cómo usarlas correctamente.
En un principio, Javascript manejaba las funciones asíncronas con callbacks. Quienes han trabajado de esta manera, de seguro se han presentado con el siguiente problema de estructura anidada:
Después salieron las promesas para “resolver” este problema; pero no fue una solución efectiva, simplificaban la estructura pero mantenían el código encadenado. Se ve así:
En 2017, surgió una solución de estructura y legibilidad del código: las funciones Async/Await.
Este es un ejemplo de una función de promesas. Como lo dice su nombre, su objetivo es traer los seguidores de un usuario por su correo.
No se ve tan mal porque es función relativamente sencilla, pero sigue con una estructura no convencional. La versión actual de Javascript permite mejorarla.
El siguiente ejemplo es la misma función, pero implementada con async/await y try/catch para el manejo de errores:
Esta función satisface la estructura moderna de Javascript, ya que:
• Tiene una indentación pareja
• Las líneas de código son cortas
• El catch para los errores esta aparte del código principal.
En cuanto a su sintaxis, la palabra await va con la función que cuenta una promesa. Prácticamente le dice al flujo de la función que espere al resultado de esa promesa. Cabe recalcar que los await deben de vivir en una función asíncrona, no pueden estar en niveles superiores de código. Para declarar una función asíncrona, se debe de agregar la palabra async.
Una de las ventajas de las funciones async/await es que una no depende de la otra para ejecutarse. En el caso de las promesas o callbacks, como son anidadas, dejan la responsabilidad a las primeras funciones. Esto se ve reflejado en el siguiente ejemplo:
La función regresa un objeto de información de una empresa, con datos generales, empleados, instalaciones y clientes. Si una de estas llamadas al fetchBusiness... no regresa nada o tiene un error, las siguientes funciones se seguirán ejecutando sin problema.
En el caso de usar promesas, si una de las primeras funciones falla, como fetchBusiness() , las demás no se ejecutarían. En el siguiente ejemplo se ve reflejado este problema:
Y así revisamos desventajas de las promesas y las ventajas de las funciones async/await. Espero que les haya gustado este artículo y recuerda: ¡no uses callbacks!
