使用不同的URL在Javascript中生成多个API拉取

Question

我正试图从同一个API中提取数据，但某些信息的格式不同。

const getPokemon = async id => {
const url = `https://pokeapi.co/api/v2/pokemon/${id}`;
const res = await fetch(url);
const pokemon = await res.json();
createPokemonCard(pokemon);
};

一些数据在不同的URL字符串下，https://pokeapi.co/api/v2/pokemon-species/$｛id｝/所以我考虑用那个名为getFlavor的API调用制作另一个变量。

const fetchPokemon = async () => {
for (let i = 1; i<= dex_id; i++) {
await getPokemon(i);
await getFlavor(i);
}
};
const getPokemon = async id => {
const url = `https://pokeapi.co/api/v2/pokemon/${id}`;
const res = await fetch(url);
const pokemon = await res.json();
createPokemonCard(pokemon);
};
const getFlavor = async id => {
const url = `https://pokeapi.co/api/v2/pokemon-species/${id}/`;
const res = await fetch(url);
const flavor = await res.json();
}
fetchPokemon();

我想要getFlavor变量中的flavor_text_entries，所以我尝试在这里调用它：

const flavor_entry = flavor.flavor_text_entries;

然而，当我调用flavor_entry时，它表示flavor是未定义的。我做错了什么？

Answer 1

在fetchPokemon()方法中，您尚未将两次调用的结果分配给变量。变量flavor和pokemon的作用域分别为它们在其中定义的方法，因此您不能在这些方法之外访问它们。