3 minutos de lectura

Introducción a las promesas en Javascript

Puntos a ver ...

Introducción a las Promesas en JavaScript

Las promesas en JavaScript son una de las características más importantes para manejar operaciones asincrónicas. Antes de las promesas, el manejo de estas operaciones se hacía típicamente con callbacks, lo que a menudo llevaba a un código difícil de leer y mantener, conocido como “Callback Hell”. Las promesas mejoran la legibilidad del código al permitir encadenar acciones de manera más lógica y manejable.

¿Qué es una Promesa?

Una promesa es un objeto que representa el eventual resultado (o falla) de una operación asincrónica. Una promesa puede estar en uno de los siguientes estados:

  1. Pending (Pendiente): Estado inicial, ni cumplido ni rechazado.
  2. Fulfilled (Cumplido): La operación se completó exitosamente.
  3. Rejected (Rechazado): La operación falló.

Cuando la promesa se cumple o se rechaza, se puede manejar la respuesta utilizando los métodos .then() y .catch().

Creación de una Promesa

const miPromesa = new Promise((resolve, reject) => {
    const exito = true; // Puedes cambiar esto para probar diferentes casos
    if (exito) {
        resolve("¡La operación fue exitosa!");
    } else {
        reject("Hubo un error en la operación.");
    }
});

En este ejemplo, miPromesa es una promesa que se cumple si exito es true, o se rechaza si es false.

Manejo de Promesas

Para manejar el resultado de una promesa, se utilizan los métodos .then() y .catch():

miPromesa
    .then((mensaje) => {
        console.log(mensaje); // "¡La operación fue exitosa!"
    })
    .catch((error) => {
        console.error(error); // "Hubo un error en la operación."
    });

Encadenamiento de Promesas

Una de las principales ventajas de las promesas es la capacidad de encadenarlas, lo que facilita realizar múltiples operaciones asincrónicas en secuencia:

const promesa1 = new Promise((resolve, reject) => {
    setTimeout(() => resolve("Promesa 1 cumplida"), 1000);
});

const promesa2 = new Promise((resolve, reject) => {
    setTimeout(() => resolve("Promesa 2 cumplida"), 2000);
});

promesa1
    .then((resultado1) => {
        console.log(resultado1); // "Promesa 1 cumplida"
        return promesa2;
    })
    .then((resultado2) => {
        console.log(resultado2); // "Promesa 2 cumplida"
    })
    .catch((error) => {
        console.error(error);
    });

En este ejemplo, la segunda promesa solo se ejecuta después de que la primera se haya cumplido.

Promesas Paralelas con Promise.all

Promise.all([promesa1, promesa2])
    .then((resultados) => {
        console.log(resultados); // ["Promesa 1 cumplida", "Promesa 2 cumplida"]
    })
    .catch((error) => {
        console.error("Una de las promesas falló", error);
    });

Con Promise.all, todas las promesas deben cumplirse para que el .then() se ejecute. Si una de ellas falla, se ejecutará el .catch().