Las promesas en JavaScript son una manera más elegante de trabajar con código asíncrono que los callbacks, pues evitan el famoso callback hell. Aunque actualmente las promesas o promises de JavaScript están siendo remplazadas por async y await es bueno saber cómo funcionan las mismas.

Hoy vamos a ver cómo funcionan las promesas con JavaScript, además de aprender a crear promesas y devolverlas en una función.

El problema con los callbacks

Debido a la naturaleza asíncrona de JavaScript, debería existir una manera de ejecutar código cuando determinada opción termine, sin saber cuándo terminará.

Para ello se comenzaron a usar los callbacks, pero el problema viene cuando se anidan:

See the gist on github.

Si anidamos más y más cosas, al final tendremos un código no tan legible.

Las promesas vienen a solucionar eso.

Promesas en JavaScript

Las promesas usan then, catch y finally. En lugar de especificar un callback, se especifica un “then” o “y entonces”.

De esta manera las promesas se pueden anidar, y para manejar los errores se cuenta con finally y catch:

See the gist on github.

Lo único que tenemos que hacer en la función es regresar una promesa para que la misma pueda ser anidada. Si todo va bien, se ejecuta el then, y si no, se pueden manejar con catch y err.

Promise, resolve y reject

Muchas funciones nativas de JavaScript ya incorporan las promesas, por ejemplo, fetch.

Nosotros también podemos crear nuestras propias promesas usando la clase Promise. Para crear una promesa pasamos una función como primer argumento.

Esa función tendrá un resolve y un reject, que serán a su vez funciones. Si llamamos a resolve, será llamado el then en la promesa, y si la rechazamos con reject, será llamado el catch en caso de que exista.

Por ejemplo veamos esta función para obtener datos de MySQL convirtiendo un callback a una promesa:

See the gist on github.

La librería de MySQL funciona con callbacks, pero podemos adaptarla para que funcione con promesas.

En el otro lado, cuando se invoque a esta función, su uso podría ser así:

See the gist on github.

El método devolverá una promesa, así que simplemente esperamos a que se resuelva, o atrapamos el error.

Todo esto se puede hacer para remplazar a los callbacks.