Promesas en JavaScript

Una promesa en JavaScript es un objeto que representa la finalización (o el fracaso) de una operación asincrónica. Las promesas permiten manejar operaciones que tardan en completarse, como las peticiones a servidores, sin bloquear la ejecución del código.

¿Qué es una Promesa?

Una promesa puede estar en uno de los siguientes estados:

Pending (Pendiente): El estado inicial de una promesa. La operación aún no se ha completado.
Fulfilled (Cumplida): La operación se completó correctamente y la promesa se resolvió.
Rejected (Rechazada): La operación falló y la promesa fue rechazada.

Sintaxis de una Promesa

Una promesa se crea utilizando el constructor Promise, que toma una función de devolución de llamada con dos parámetros: resolve y reject. La función resolve se llama si la operación se completa correctamente, y reject se llama si ocurre un error.


const miPromesa = new Promise((resolve, reject) => {
    let exito = true;
                
    if (exito) {
        resolve("La operación fue exitosa.");
    } else {
        reject("Hubo un error en la operación.");
    }
});

Usar Promesas: `then()` y `catch()`

Una vez que se crea una promesa, puedes manejar su resolución o rechazo usando los métodos then() y catch().

then(): Se ejecuta cuando la promesa se resuelve correctamente (es decir, se cumple).
catch(): Se ejecuta cuando la promesa es rechazada (es decir, hay un error).


.then(result => {
    console.log(result); 
})

.catch(error => {
    console.log(error); 
});

Encadenamiento de Promesas

Puedes encadenar múltiples then() para realizar varias acciones secuenciales con los resultados de una promesa. Cada then() recibe el valor que fue pasado por la promesa anterior.


miPromesa
.then(result => {
    console.log(result);
    return "Paso 2 completado.";
})
.then(result => {
    console.log(result);
    return "Paso 3 completado.";
})
.catch(error => {
    console.log(error);
});

Promesas en Funciones Asincrónicas

Puedes usar async y await con promesas para simplificar el manejo de código asincrónico. La palabra clave async convierte una función en una función asincrónica, y await permite esperar a que una promesa se resuelva antes de continuar con el código.


async function miFuncionAsincrona() {
    try {
        const resultado = await miPromesa;
        console.log(resultado); 
    } catch (error) {
        console.log(error);
    }
}

miFuncionAsincrona();

Promesas y Operaciones Asincrónicas

Las promesas son extremadamente útiles para trabajar con operaciones asincrónicas, como peticiones a una API. Por ejemplo, si deseas obtener datos de una API utilizando el método fetch(), el cual devuelve una promesa.


fetch('https://jsonplaceholder.typicode.com/posts')

.then(response => response.json())
    .then(data => {
        console.log(data);
})

.catch(error => {
    console.log("Error en la solicitud:", error);
});

Resolución de Múltiples Promesas: `Promise.all()` y `Promise.race()`

Cuando tienes varias promesas y quieres esperar a que todas se resuelvan (o la primera que se resuelva), puedes usar:

Promise.all(): Espera a que todas las promesas se resuelvan.


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

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

Promise.all([promesa1, promesa2])
    .then(resultados => {
        console.log(resultados);
});

Promise.race(): Espera a que se resuelva la primera promesa.


Promise.race([promesa1, promesa2])
    .then(resultado => {
        console.log(resultado); 
});

Resumen

Las promesas son una herramienta esencial en JavaScript para manejar operaciones asincrónicas. Permiten escribir código más limpio y legible sin la necesidad de callbacks, ayudando a evitar el famoso "callback hell". Puedes encadenar promesas, manejar múltiples promesas a la vez con Promise.all() o Promise.race(), y usar async/await para escribir código asincrónico de manera más intuitiva.

Anterior Siguiente