Estoy tratando de mapear un resultado de API para mostrar los datos, pero cuando ejecuto mi código, la consola muestra TypeError: pokemons.map no es una función, pero hago lo mismo en otro script y funciona allí. No entiendo por qué esta vez .map no funciona.
const result = document.getElementById('result'); const form = document.querySelector('form'); let pokemons = []; async function fetchPokemon() { fetch(`https://pokeapi.co/api/v2/pokemon/ditto`) .then((res) => res.json()) .then((data) => (pokemons = data)); console.log(pokemons) }; fetchPokemon(); function pokemonDisplay() { result.innerHTML = pokemons.map( (pokemon) => ` <h2>${pokemon.forms[0].name}</h2> ` ) } form.addEventListener('submit', (e) => { e.preventDefault(); fetchPokemon().then(() => pokemonDisplay()); }) console.log(result); <div class="app"> <form action=""> <label for="search">Entrez le nom d'un pokemon (en anglais)</label> <input type="text" id="search" placeholder="ex : ditto"> </form> <ul id="result"></ul> </div>https://pokeapi.co/api/v2/pokemon/ditto devuelve el objeto, no la matriz (ídem Pokémon). map es la función de Array, es por eso que detecta este error.