Promesas en JavaScript con la PokeAPI

En JavaScript, una promesa es un objeto que representa la finalización (o falla) de una operación asíncrona y su valor resultante. Las promesas hacen que el manejo de operaciones asíncronas, como las solicitudes a una API, sea más fácil y manejable que usando callbacks solos.

¿Qué es una Promesa?

Una promesa puede estar en uno de estos tres estados:

1. Pendiente (Pending): La operación asíncrona aún no ha finalizado.
2. Cumplida (Fulfilled): La operación asíncrona ha finalizado con éxito y se tiene un resultado.
3. Rechazada (Rejected): La operación asíncrona ha fallado y se tiene una razón del fallo.

Una promesa se crea usando el constructor Promise y proporciona dos métodos principales para manejar el resultado:

• then(): Se ejecuta cuando la promesa se cumple.
• catch(): Se ejecuta cuando la promesa es rechazada.

Ejemplo de uso de Promesas con la PokeAPI

Supongamos que queremos obtener información sobre un Pokémon, como Pikachu, de la PokeAPI. Usaremos una promesa para manejar la solicitud asíncrona.

1function obtenerPokemon(nombre) {
2  return new Promise((resolve, reject) => {
3    fetch(`https://pokeapi.co/api/v2/pokemon/${nombre}`)
4      .then(response => {
5        if (!response.ok) {
6          throw new Error("Error en la solicitud");
7        }
8        return response.json();
9      })
10      .then(data => resolve(data))
11      .catch(error => reject(error));
12  });
13}
14
15// Usando la promesa
16obtenerPokemon("pikachu")
17  .then(pokemon => {
18    console.log("Nombre:", pokemon.name);
19    console.log("Altura:", pokemon.height);
20    console.log("Peso:", pokemon.weight);
21  })
22  .catch(error => {
23    console.error("Error al obtener los datos:", error);
24  });

En este ejemplo:

• obtenerPokemon(nombre): Esta función devuelve una promesa que realiza una solicitud a la PokeAPI.
  • Si la solicitud es exitosa, la promesa se resuelve (resolve) con los datos del Pokémon.
  • Si ocurre un error, la promesa se rechaza (reject) con un mensaje de error.
• then(): Se usa para manejar el caso en que la promesa se cumple (es decir, cuando los datos del Pokémon se obtienen correctamente).
• catch(): Se usa para manejar cualquier error que ocurra durante la solicitud o el procesamiento de la respuesta.

Resultado: Cuando llamas a obtenerPokemon("pikachu"), si la solicitud es exitosa, verás algo como esto en la consola:

Nombre: pikachu
Altura: 4
Peso: 60

Si ocurre un error (por ejemplo, si escribes mal el nombre del Pokémon), el bloque catch se activará y mostrará un mensaje de error.

Ventajas de las Promesas

• Manejo de errores: Las promesas permiten manejar errores de manera más clara y estructurada usando catch.
• Encadenamiento: Puedes encadenar múltiples operaciones asíncronas con then para hacer que el código sea más limpio y más fácil de seguir.
• Más legible: Las promesas hacen que el código asíncrono sea más legible y evitan el "callback hell" (un anidamiento excesivo de callbacks).

Resumen

• Una promesa en JavaScript es un objeto que representa la eventual finalización (o falla) de una operación asíncrona.
• Las promesas tienen tres estados: pendiente, cumplida, o rechazada.
• Se manejan usando then() para los casos exitosos y catch() para los errores.
• En el ejemplo de la PokeAPI, usamos una promesa para obtener y manejar los datos de un Pokémon de manera más limpia y manejable.

Las promesas son una herramienta poderosa para manejar el código asíncrono en JavaScript, haciendo que tu código sea más fácil de entender, depurar y mantener.