Guía de Promesas en JavaScript
1. ¿Qué es una Promesa?
Una promesa en JavaScript es un objeto que representa la eventual finalización (o
falla) de una operación asíncrona y su valor resultante. Las promesas permiten
trabajar con operaciones asíncronas de una manera más legible y manejable que los
callbacks anidados.
2. Creación de una Promesa
Para crear una promesa, se utiliza el constructor Promise , que toma una función
ejecutora con dos parámetros: resolve y reject .
const miPromesa = new Promise((resolve, reject) => {
// Código asíncrono
let exito = true; // Simulando una condición de éxito
if (exito) {
resolve("¡Operación exitosa!");
} else {
reject("Hubo un error.");
}
});
En este ejemplo, la promesa se resuelve con éxito si la condición exito es true ,
de lo contrario, se rechaza.
3. Consumo de Promesas
Para manejar el resultado de una promesa, se utilizan los métodos then , catch y
finally .
then
El método then se usa para manejar el caso de éxito de una promesa.
miPromesa.then((mensaje) => {
console.log(mensaje); // "¡Operación exitosa!"
});
catch
El método catch se usa para manejar el caso de rechazo de una promesa.
miPromesa.catch((error) => {
console.log(error); // "Hubo un error."
});
finally
El método finally se ejecuta después de que la promesa se resuelve o se rechaza,
independientemente del resultado.
miPromesa.finally(() => {
console.log("Operación completada.");
});
4. Encadenamiento de Promesas
Las promesas pueden encadenarse para manejar una secuencia de operaciones
asíncronas.
miPromesa
.then((mensaje) => {
console.log(mensaje); // "¡Operación exitosa!"
return "Siguiente paso";
})
.then((siguienteMensaje) => {
console.log(siguienteMensaje); // "Siguiente paso"
})
.catch((error) => {
console.log(error);
});
5. Métodos Útiles para Promesas
JavaScript proporciona varios métodos útiles para trabajar con promesas.
Promise.all
Este método toma un arreglo de promesas y se resuelve cuando todas las promesas
del arreglo se resuelven.
const promesa1 = Promise.resolve(3);
const promesa2 = 42;
const promesa3 = new Promise((resolve, reject) => {
setTimeout(resolve, 100, 'foo');
});
Promise.all([promesa1, promesa2, promesa3]).then((valores) => {
console.log(valores); // [3, 42, "foo"]
});
Promise.race
Este método toma un arreglo de promesas y se resuelve o rechaza tan pronto como
una de las promesas del arreglo se resuelve o rechaza.
const promesa1 = new Promise((resolve, reject) => {
setTimeout(resolve, 500, 'uno');
});
const promesa2 = new Promise((resolve, reject) => {
setTimeout(resolve, 100, 'dos');
});
Promise.race([promesa1, promesa2]).then((valor) => {
console.log(valor); // "dos"
});
Promise.allSettled
Este método toma un arreglo de promesas y se resuelve después de que todas las
promesas se hayan resuelto o rechazado, devolviendo un arreglo de objetos que
describen el resultado de cada promesa.
const promesa1 = Promise.resolve(3);
const promesa2 = new Promise((resolve, reject) => {
setTimeout(reject, 100, 'error');
});
Promise.allSettled([promesa1, promesa2]).then((resultados) => {
console.log(resultados);
// [{status: "fulfilled", value: 3}, {status: "rejected", reason: "error
});
Promise.any
Este método toma un arreglo de promesas y se resuelve tan pronto como una de las
promesas se resuelve, rechazándose solo si todas las promesas son rechazadas.
const promesa1 = new Promise((resolve, reject) => {
setTimeout(reject, 100, 'error1');
});
const promesa2 = new Promise((resolve) => {
setTimeout(resolve, 200, 'resultado');
});
const promesa3 = new Promise((resolve, reject) => {
setTimeout(reject, 300, 'error2');
});
Promise.any([promesa1, promesa2, promesa3]).then((valor) => {
console.log(valor); // "resultado"
});
6. Promesas en Funciones Asíncronas
Las funciones async y await simplifican el manejo de promesas, permitiendo
escribir código asíncrono que se asemeja al código síncrono.
async function miFuncionAsincrona() {
try {
const resultado = await miPromesa;
console.log(resultado); // "¡Operación exitosa!"
} catch (error) {
console.log(error); // "Hubo un error."
} finally {
console.log("Operación completada.");
}
}
miFuncionAsincrona();
