Advertisement
  1. Code
  2. Node.js

Callbacks, promesas y funciones asíncronas de JavaScript: Parte 2

by
Read Time:7 minsLanguages:
This post is part of a series called JavaScript Callbacks, Promises and Async Functions.
JavaScript Callbacks, Promises, and Async Functions: Part 1

Spanish (Español) translation by Ruben Solis (you can also view the original English article)

Introducción

En la primera parte de este tutorial, aprendimos los principios detrás de la programación asíncrona y el uso de callbacks. Repasemos, la programación asíncrona nos permite escribir código no bloqueante mediante la ejecución de tareas bloqueantes más adelante. Los callbacks proporcionan una forma de sincronizar la ejecución de nuestro código.

Sin embargo, anidar callbacks repetidamente no es un buen patrón a seguir. Aquí vienen las promesas al rescate. Las promesas se han utilizado durante un tiempo en las bibliotecas de JavaScript, pero ahora puedes usarlas de forma nativa en tu código. Las funciones asíncronas mejoran las promesas al permitirnos escribir nuestras tareas una tras otra sin que tengamos que preocuparnos por el momento de su ejecución.

Contenido

  • Promesas
  • Funciones asíncronas
  • Repaso
  • Recursos

Promesas

Echemos un vistazo a lo que es una promesa conceptualmente. Imagina el escenario en el que compras en línea y compras un par de zapatos. Cuando finaliza la compra, se te envía por correo electrónico un resumen de tu compra.

Esta confirmación de pedido es como una promesa. La promesa es tu garantía de que recibirás algo más tarde de la compañía. Mientras tu orden está pendiente, tu vida no se detiene, por supuesto. Continúas haciendo otras tareas como navegar por internet. Si se completa tu pedido, recibirás un correo electrónico con la información de envío. Es posible que tu pedido sea rechazado. El artículo que ordenaste puede estar agotado o puede haber un problema con tu método de pago. En este caso, recibirás un correo electrónico informándote sobre el error.

En código, una promesa es un objeto que garantiza que obtendremos un valor futuro para nuestra petición, ya sea que tenga éxito o no. Esta es la forma general de crear y usar una promesa:

Para crear una promesa, creas una instancia de un objeto de promesa y escribes tu código asíncrono dentro de la función callback de la promesa. Los datos que deseas devolver de la promesa se pasan como un argumento a la función resolve, y tu mensaje de error se pasa a la función de reject. Encadenamos juntos las promesas usando el método then. Esto nos permite ejecutar las tareas secuencialmente.

Si necesitamos pasar los resultados de una tarea a la siguiente tarea, la devolvemos en el método then. Es posible que deseemos encadenar promesas juntas cuando estemos interesados ​​en transformar valores o necesitemos ejecutar nuestro código en un orden particular. Al final de la cadena, capturamos nuestros errores. Si se produce un error en cualquiera de nuestras tareas, se omiten las tareas restantes y el error se envía a nuestro bloque catch.

En la primera parte de este tutorial, utilizamos callbacks para abrir un archivo y recuperar una publicación y sus comentarios. Así es como se ve el código completo usando promesas:

index.js

La diferencia aquí es que nuestro método para abrir el archivo ahora está envuelto en un objeto promesa. Y en lugar de anidar nuestras tareas con callbacks, se encadenan con then.

Como puedes ver, no hemos eliminado la necesidad de callbacks. Solo los estamos usando de manera diferente. Antes, anidábamos nuestros callbacks para poder continuar la ejecución de nuestro código en la siguiente tarea.

Esto me recuerda cuando llamo al servicio al cliente sobre un problema y, en lugar de que el agente lo resuelva, me transfieren a otra persona. Que otra persona pueda o no resolver la llamada, pero en lo que respecta al primer agente, es responsabilidad de otra persona.

Con promesas, obtendremos algo a cambio antes de pasar a la siguiente tarea. Si necesitamos llevar ese algo a la siguiente continuación de nuestro código, podemos usar una instrucción then.

Tarea

Usando promesas, escribe un programa que abra un archivo de usuarios, obtén la información del usuario y luego abre un archivo de publicaciones e imprime todas las publicaciones del usuario.

Funciones asíncronas

Las promesas son una mejora en el diseño de nuestro programa, pero podemos hacerlo mejor. Sería muy conveniente si pudiéramos ejecutar nuestras tareas síncronamente así:

Bueno, podemos con el patrón async/await. Para hacer esto, comenzamos envolviendo nuestras tareas en una función asíncrona. Esta función devuelve una promesa. Luego, implementamos el manejo de errores envolviendo nuestras tareas dentro de una declaración try/catch.

Si se cumple la promesa, se completarán las tareas que estaban dentro de nuestro bloque try. Si se rechaza, se ejecutará el bloque catch. Agregar la palabra clave await antes de cualquier tarea detiene nuestro programa hasta que se completa la tarea.

Esta es la forma general para usar funciones asíncronas:

Usando este patrón, podemos reescribir cómo ejecutamos nuestro código en nuestro ejemplo de archivos.

Me gusta estructurar nuestro código asíncrono con una declaración try/catch porque separa claramente el código de manejo de errores del código normal. Si alguno de los códigos de nuestro bloque try causa un error, será manejado por el bloque catch. Además, podemos agregar un bloque finally que ejecutará código independientemente de si nuestras tareas tienen éxito o fallan.

Un ejemplo de uso de este patrón es cuando tenemos un código de limpieza que necesitamos ejecutar. Este código no tiene que estar necesariamente contenido en un bloque finally. Se puede escribir después de la instrucción catch y se ejecutará. Las promesas no tienen esta sintaxis incorporada. Tendríamos que encadenar otra declaración then después de nuestra declaración catch para lograr el mismo efecto.

Tarea

Usando async/await, escribe un programa que abra un archivo de usuarios, obtén la información del usuario y luego abre un archivo de publicaciones e imprime la información del usuario y todas sus publicaciones.

Repaso

Los callbacks no son inherentemente malos. Pasar funciones a otras funciones es un patrón útil en JavaScript. Los callbacks se convierten en un problema cuando los usamos para controlar el flujo de la lógica de nuestra aplicación. Dado que JavaScript es asíncrono, tenemos que cuidar la forma en que escribimos nuestro código porque las tareas no necesariamente terminarán en el orden en que fueron escritas. Eso no es malo porque no queremos que ninguna tarea bloquee la continuación del programa.

Las promesas son un mejor patrón para escribir código asíncrono. No solo solucionan el desorden de los callbacks anidados, sino que también mantienen el control del resultado de una tarea dentro de la tarea. Pasar el control a otra tarea, ya sea que esa tarea sea nuestro propio código o una API de terceros, hace que nuestro código sea menos confiable. Por último, las funciones asíncronas nos permiten escribir nuestro código de forma síncrona, lo que es mucho más intuitivo y más fácil de entender.

Recursos

Advertisement
Advertisement
Looking for something to help kick start your next project?
Envato Market has a range of items for sale to help get you started.