From One Junior to Another: How Pokémon Helped Me Finally Understand Async JavaScript

It's funny how I also struggled to figure out why the first code snippet wasn't working 😅. I eventually had to use AI for help 🥲.

So without using the async syntax, which makes things easy to read and understand, the way to get the data from the resolved promise will be like this:

function getBadPokemon() {
  return fetch('pokeapi.co/api/v2/pokemon/pikachu')
    .then(response => response.json())
    .then(data =>  {
        console.log(data); // Now you can see the pokemon
        return data; // Returns the pokemon data
    })
}

getBadPokemon().then(pokemon => {
  console.log("Pokemon Data:", pokemon);
});

We return the promise from the fetch call, and then get the actual data here:

getBadPokemon().then(pokemon => {
  console.log("Pokemon Data:", pokemon);
});