Skip to main content

Command Palette

Search for a command to run...

Trabajo asíncrono en Javascript: Promesas y async/await

¿Promesas y async/await? ¿cuál es "mejor"? ¿para qué sirven? ¿Cómo controlo sus flujos?

Updated
3 min read
Trabajo asíncrono en Javascript: Promesas y async/await
A

I'm a tech lead at WOM Chile, I love React, Javascript, Node, Python, Rust & Dart, so let's talk about it!

Como desarrollador en JavaScript, es probable que hayas escuchado acerca de las promesas y el uso de async/await para manejar su flujo. En esta artículo, te explicaré qué son las promesas, cómo se usan y cómo async/await puede ayudar a manejar el flujo de trabajo.

Promesas

Una promesa en JavaScript es un objeto que representa un valor que puede no estar disponible todavía, pero que se espera que lo esté en algún momento. Las promesas se utilizan para manejar operaciones asíncronas que toman tiempo en completarse, como hacer una solicitud HTTP o leer un archivo.

Creando una promesa

Para crear una promesa en JavaScript, utilizamos el constructor Promise. Este constructor toma una función como argumento, que a su vez toma dos argumentos: resolve y reject. resolve se utiliza para devolver el valor de la promesa una vez que se ha completado exitosamente, mientras que reject se utiliza para devolver el error en caso de que la promesa falle.

const promise = new Promise((resolve, reject) => {
  // ... do some async work
  if (success) {
    resolve(result);
  } else {
    reject(error);
  }
});

Consumiendo una promesa

Para consumir una promesa, podemos usar los métodos then y catch. then se utiliza para manejar el valor de la promesa en caso de que se resuelva correctamente, mientras que catch se utiliza para manejar el error en caso de que la promesa falle.

promise.then((result) => {
  console.log(result);
}).catch((error) => {
  console.error(error);
});

Async/Await

async/await es una forma de manejar promesas en JavaScript que se introdujo en ES2017. async se utiliza para marcar una función como asincrónica, lo que significa que devolverá una promesa en lugar de un valor directo. await se utiliza dentro de una función async para esperar a que una promesa se resuelva antes de continuar con la ejecución del código.

Buenas prácticas

Cuando se trabaja con async/await, es importante asegurarse de que se manejen correctamente los errores. Una forma de hacerlo es envolver el código await en un bloque try/catch.

async function myFunction() {
  try {
    const result = await someAsyncFunction();
    console.log(result);
  } catch (error) {
    console.error(error);
  }
}

Además, es importante tener en cuenta que el uso excesivo de async/await puede afectar el rendimiento del código. Por lo tanto, se recomienda utilizarlo solo cuando sea necesario.

Malas prácticas

Una mala práctica común cuando se trabaja con async/await es no manejar correctamente los errores. Si no se envuelve el código await en un bloque try/catch, los errores pueden propagarse y causar problemas en otras partes del código.

Otra mala práctica es utilizar async/await en funciones que no necesitan ser asincrónicas. Esto puede afectar negativamente el rendimiento y la legibilidad del código.

Conclusión

En resumen, las promesas son una forma de manejar operaciones asíncronas en JavaScript, mientras que async/await es una forma más fácil de manejar el flujo de trabajo al trabajar con promesas. Es importante seguir buenas prácticas, como manejar correctamente los errores y utilizar async/await solo cuando sea necesario, para asegurarse de que el código sea legible y eficiente.

Si quieres profundizar más sobre el tema, te recomiendo siempre revisar la documentación oficial, seguirme en redes sociales o suscribirte a la newsletter del blog para seguir aprendiendo. Enjoy the journey!

Fuentes

Basics Javascript

Part 1 of 5

En esta serie incluiré todos los aspectos básicos del lenguaje tanto para empezar como confirmar tu conocimiento en Javascript. ¡Disfrútalo!

Up next

Pila de ejecución de JavaScript

¡Aprende sobre la pila de ejecución y el bucle de eventos en JavaScript! Descubre cómo controlan el flujo de ejecución y manejan la asincronía