Callbacks vs Promise vs Async/Await en JavaScript

Desde hace un tiempo atras ha empezado a haber un cambio en los metodos para correr functiones asíncronas. Inicialmente teniamos los famosos callbacks que aun son muy utilizados, estos hacen que nuestro código empiece a crecer en indentación y lo que se conoce como el callback hell (infierno del callback) lo que se ve como algo asi:

Luego nacio Promise o promesas, estas permiten encadenar las funciones que queremos correr, una detras de la otra lo cual soluciona el problema del callback hell en el ejemplo anterior.

Mas adelante aparecio la que a mi parecer es la mejor sintaxis para este tipo de tareas hasta el momento, async/await. Este se utiliza de manera similar al código sincrónico, pero corre de forma asíncrona y no bloquea la ejecución.

Las principales diferencias en async/await es que las funciones deben ser declaradas con async, lo cual hace que la función automaticamente retorne una promesa.

async function upload() {
  return S3.upload(params).promise();
}

Cuando llamamos a esta función debemos usar await,  para esperar la respuesta de la promesa

const response = await upload(params);

Una desventaja es que ya que no se puede hacer await fuera de una función async este no puede correr en el primer nivel, siempre debera correr dentro de una función async.


¿Por qué es mejor?

  1. Async/await hace que el código sea mas limpio y conciso, por ende es mas fácil de entender y mantener.
  2. Nos ayuda a deshacernos del anidado de los callbacks.
  3. Mejor manejo de errores, ya que nos indica en que función ocurre un error a diferencia de las promesas.
  4. Mejora en el proceso de debugging en comparación con las promesas.

En conclusión

Async/await es una de las caracteristicas mas interesantes añadida a javascript en los ultimos años, te ayudara mejorar la legibilidad de tu código y nos deshacemos del callback hell.

Deja un comentario

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