El método `then()` se usa principalmente con promesas para manejar el resultado exitoso de una operación asíncrona. Es una parte fundamental del manejo de promesas en JavaScript. Aquí te explico cuándo y cómo se usa `then()`:
1. Manejo de resolución de promesas:
El `then()` se utiliza para especificar qué hacer cuando una promesa se resuelve exitosamente.
const miPromesa = new Promise((resolve) => { setTimeout(() => resolve("Datos obtenidos"), 2000); }); miPromesa.then((resultado) => { console.log(resultado); // Imprime: "Datos obtenidos" });
2. Encadenamiento de operaciones:
Puedes encadenar múltiples `then()` para realizar operaciones secuenciales.
fetch('https://api.ejemplo.com/usuarios') .then(respuesta => respuesta.json()) .then(datos => { console.log(datos); return datos.id; }) .then(id => fetch(`https://api.ejemplo.com/usuarios/${id}/posts`)) .then(respuesta => respuesta.json()) .then(posts => console.log(posts));
3. Transformación de datos:
Cada `then()` puede transformar los datos y pasarlos al siguiente `then()`.
const promesaNumero = Promise.resolve(5); promesaNumero .then(numero => numero * 2) .then(numeroDoble => numeroDoble + 3) .then(resultado => console.log(resultado)); // Imprime: 13
4. Manejo de errores en cadena:
Puedes usar `then()` junto con `catch()` para manejar tanto el éxito como el error.
obtenerDatos() .then(procesarDatos) .then(guardarDatos) .then(() => console.log("Operación completada")) .catch(error => console.error("Ocurrió un error:", error));
5. Retorno de nuevas promesas:
Puedes retornar una nueva promesa dentro de un `then()` para continuar con operaciones asíncronas.
obtenerUsuario(id) .then(usuario => { return obtenerPosts(usuario.id); // Retorna una nueva promesa }) .then(posts => { console.log(posts); });
Es importante notar que mientras `then()` es muy útil y ampliamente utilizado, el uso de `async/await` a menudo puede hacer que el código sea más legible, especialmente en operaciones asíncronas complejas. Sin embargo, entender `then()` es crucial para trabajar con promesas y para comprender mejor cómo funciona `async/await` bajo el capó.
¿Te ha resultado útil??
0 / 0