Las promesas son un concepto fundamental para entender la importancia de JavaScript en el contexto del desarrollo, pues nos permiten crear y controlar procesos asíncronos. En este post, te enseñaremos qué es y cómo funciona el objeto promise en JavaScript, la manera de crear promesas en este lenguaje de programación.
¿Qué es el objeto promise en JavaScript?
El objeto promise en JavaScript es un tipo de proxy en este lenguaje de programación. Esto quiere decir que un objeto de promesa es un tipo de dato, como lo sería un objeto de fecha (Date).
Un objeto de promesa se usa para determinar los estados y resultados de procesos asíncronos. Es decir, aquellos procesos que no sabemos exactamente cuándo van a terminar y qué resultado van a devolver. Entonces, lo que realmente se puede hacer en una promesa es preparar el código en caso de distintos desenlaces. Para ello, se utilizan los métodos then y catch.
El método then nos permite determinar las acciones asíncronas que se deben ejecutar en caso de que la promesa sea resuelta. Por su parte, el método catch define una acción asíncrona en caso de que la promesa se devuelva con un resultado insatisfactorio. Este método también nos permite controlar errores que sucedan en el proceso asíncrono.
Ambos métodos, a su vez, devuelven otra promesa que puede o no ser controlada de nuevo. Es decir, podemos crear promesas encadenadas agregando .then o .catch después de la ejecución de una línea de código igual. En este sentido, podemos crear varias opciones para controlar la resolución o rechazo de una promesa. Sin embargo, es importante tener cuidado con esta estrategia, pues nos puede llevar a un callback hell.
Si quieres conocer más sobre este objeto, te invitamos a leer la documentación oficial de Mozilla Developer Network sobre promise.
¿Cómo funciona el objeto promise en JavaScript?
Por lo general, el objeto promise en JavaScript se escribe como el resultado de una función. Es decir, se crea una función que obtenga como return una nueva instancia del objeto promise. A continuación, te ponemos un ejemplo, que continúa la narrativa de nuestro post sobre promesas en frontend JavaScript.
function irAPorPatatas ( ) {
return new Promise (function (resolve, reject) {
const hayPatatas = buscarPatatasEn3Sitios ( )
if (hayPatatas) {
resolve (‘🥔 🥔’)
} else {
reject (‘😭 😭’)
}
})
}
Como hemos visto antes, esta función después puede ser controlada por los métodos then y catch. Siguiendo el ejemplo anterior, podríamos escribir un pseudocódigo como el siguiente:
irAPorPatatas
.then (hacerTortilla)
.catch (pedirPizza)
Sin embargo, como un objeto promise en JavaScript es un tipo de dato. al igual que Date, realmente puede ubicarse en cualquier parte de nuestro código. Finalmente, cuando escribimos new al lado de promise, estamos creando una nueva instancia de la clase. Entonces, podríamos ubicar esta instancia como, por ejemplo, el valor de una variable:
const promise = new Promise ( )
En este sentido, estaríamos almacenando una instancia de la clase promise en la constante promise. Por ello, dentro de esta constante podríamos insertar todas las líneas de código que vienen normalmente con una promesa:
const promise = new Promise (function (resolve, reject) {
///
resolve ( )
})
Después de este código, podríamos retornar la promesa desde el nombre de variable que le hemos dado:
return promise;
Otra opción para manejar el resultado de la promesa que hemos guardado sería usar los métodos then y catch como propiedades de la constante promise. Es decir, escribiríamos algo como lo siguiente:
promise.then (( ) => {
console.log (‘la promesa se ha resuelto’);
});
Como puedes ver en las anteriores líneas de código, no siempre es necesario crear una función para manejar el objeto promise en JavaScript. De hecho, podemos escribir JavaScript plano para manejar este objeto desde una variable que lo almacena. En nuestro ejemplo, esta promesa se resuelve automáticamente y esta resolución se maneja ejecutando el comando promise.then, que en este caso es un simple console.log que nos dice que la promesa se ha resuelto.
¿Quieres seguir aprendiendo?
Ahora que sabes exactamente qué es y cómo funciona el objeto promise en JavaScript, estamos seguros de que quieres seguir aprendiendo sobre las posibilidades de este lenguaje de programación. Por ello, te invitamos a nuestro Desarrollo Web Full Stack Bootcamp, un espacio de formación intensiva e íntegra donde aprenderás a desarrollar no solo con JavaScript, sino también con lenguajes como HTML, CSS y JSX. ¡Anímate a seguir aprendiendo con nosotros e inscríbete para impulsar tu carrera!
