多次获取 arrays 到响应中

Question

我现在是学生，正在尝试使用 diff 端点（themoviedb API）进行多次获取请求。

//to get movie list
fetch('https://api.themoviedb.org/3/movie/now_playing?api_key='+key+'&language='+lang).then(resp=> resp.json())
//data
results: [
      {
        adult: false,
        backdrop_path: '/faXT8V80JRhnArTAeYXz0Eutpv9.jpg',
        genre_ids: [ 16, 28, 12, 35, 10751, 14 ],
        id: 315162,
        original_language: 'en',
        original_title: 'Puss in Boots: The Last Wish',
        overview: "Secuela de 'El gato con botas' (2011). El Gato con Botas descubre que su pasión por la aventura le ha pasado factura: ha consumido ocho de sus nueve vidas, por ello emprende un viaje épico para encontrar el mítico Último Deseo y restaurar sus nueve vidas...",
        popularity: 5032.178,
        poster_path: '/lyP4WNmUiiOgl4g2z7ywE0z6SGF.jpg',
        release_date: '2022-12-07',
        title: 'El Gato con Botas: El último deseo',
        video: false,
        vote_average: 8.6,
        vote_count: 3032
      },
]

现在获取流派列表

fetch('https://api.themoviedb.org/3/genre/movie/list?api_key='+key+'&language='+lang).then(resp=>resp.json())

//data
[
{ id: 28, name: 'Acción' },
{ id: 28, name: 'Acción' },
{ id: 12, name: 'Aventura' },
{ id: 16, name: 'Animación' },
{ id: 35, name: 'Comedia' },
{ id: 80, name: 'Crimen' },
{ id: 99, name: 'Documental' },
{ id: 18, name: 'Drama' },
{ id: 10751, name: 'Familia' },
{ id: 14, name: 'Fantasía' },
{ id: 36, name: 'Historia' },
{ id: 27, name: 'Terror' },
{ id: 10402, name: 'Música' },
{ id: 9648, name: 'Misterio' },
{ id: 10749, name: 'Romance' },
{ id: 878, name: 'Ciencia ficción' },
{ id: 10770, name: 'Película de TV' },
{ id: 53, name: 'Suspense' },
{ id: 10752, name: 'Bélica' },
{ id: 37, name: 'Western' }
]

我如何用第二个 fetc 中相应 ID 的名称替换每部电影（第一次获取）的 genre_ids 内容？ 提前致谢。 我想返回一个包含电影所有数据的模板，但现在我只能显示流派 ID

Answer 1

您可以使用async function 来更轻松地执行多次提取。 使用Array#find从另一个数组中获取相应的流派。

async function getData() {
    const movieList = await (await fetch('https://api.themoviedb.org/3/movie/now_playing?api_key='+key+'&language='+lang)).json();
    const genreList = await (await fetch('https://api.themoviedb.org/3/genre/movie/list?api_key='+key+'&language='+lang)).json();
    for (const movie of moveList.results)
        movie.genre_ids = movie.genre_ids.map(id => genreList.find(g => g.id === id)?.name);
}

Answer 2

幸运的是，为此你有一个单线供你使用：

 let genres = [ { id: 28, name: 'Acción' }, { id: 28, name: 'Acción' }, { id: 12, name: 'Aventura' }, { id: 16, name: 'Animación' }, { id: 35, name: 'Comedia' }, { id: 80, name: 'Crimen' }, { id: 99, name: 'Documental' }, { id: 18, name: 'Drama' }, { id: 10751, name: 'Familia' }, { id: 14, name: 'Fantasía' }, { id: 36, name: 'Historia' }, { id: 27, name: 'Terror' }, { id: 10402, name: 'Música' }, { id: 9648, name: 'Misterio' }, { id: 10749, name: 'Romance' }, { id: 878, name: 'Ciencia ficción' }, { id: 10770, name: 'Película de TV' }, { id: 53, name: 'Suspense' }, { id: 10752, name: 'Bélica' }, { id: 37, name: 'Western' } ] let movies = [ { adult: false, backdrop_path: '/faXT8V80JRhnArTAeYXz0Eutpv9.jpg', genre_ids: [ 16, 28, 12, 35, 10751, 14 ], id: 315162, original_language: 'en', original_title: 'Puss in Boots: The Last Wish', overview: "Secuela de 'El gato con botas' (2011). El Gato con Botas descubre que su pasión por la aventura le ha pasado factura: ha consumido ocho de sus nueve vidas, por ello emprende un viaje épico para encontrar el mítico Último Deseo y restaurar sus nueve vidas...", popularity: 5032.178, poster_path: '/lyP4WNmUiiOgl4g2z7ywE0z6SGF.jpg', release_date: '2022-12-07', title: 'El Gato con Botas: El último deseo', video: false, vote_average: 8.6, vote_count: 3032 }, ] for (let movie of movies) { movie.genres = genres.filter((item) => ((movie.genre_ids.indexOf(item.id) >= 0))); movie.genre_names = movie.genres.map(item => item.name); } console.log(movies);

解释：

• 流派
  • 我们使用过滤器 function 返回满足条件的项目数组的子集
  • 标准是该 ID 在我们期望的 ID 中
• 流派名称：
  • 我们使用 map function 来只获取名字

我不确定你是只想要名字还是名字连同他们的 id，所以我们都有，你可以根据自己的喜好限制结果。

请注意，我们循环movies并对每部电影执行相同的逻辑。

Answer 3

下面的getNowPlayingWithGenres ( async ) function 将返回按标题排序的当前电影列表，并包括人类可读类型列表。

注意：只需确保设置 API 键即可。

 const apiUrl = 'https://api.themoviedb.org/3', apiKey = '<API_KEY>', lang = 'en-US'; const getGenresIdMap = async () => { const res = await fetch(`${apiUrl}/genre/movie/list?api_key=${apiKey}&language=${lang}`), { genres } = await res.json(); return genres.reduce((map, { id, name }) => map.set(id, name), new Map); }; const getNowPlaying = async () => { const res = await fetch(`${apiUrl}/movie/now_playing?api_key=${apiKey}&language=${lang}`), { results } = await res.json(); return results; }; const getNowPlayingWithGenres = async () => { const genreIdMap = await getGenresIdMap(), nowPlaying = await getNowPlaying(); return nowPlaying.map(({ title, genre_ids }) => ({ title, genres: genre_ids.map(id => genreIdMap.get(id)).sort() })).sort((a, b) => a.title.localeCompare(b.title)); } (async() => { const result = await getNowPlayingWithGenres(); console.log(result); })();

 .as-console-wrapper { top: 0; max-height: 100%;important; }