如何将TMDB API电影数据的genre_ids替换为对应类型名称？

核心思路是先把类型列表转成ID-名称映射表，再用这个映射表批量替换电影的genre_ids，具体步骤和代码如下：

1. 并行获取两个接口的数据 #

电影列表和类型列表的请求互不依赖，用Promise.all并行发起请求能节省时间：

const API_KEY = 'YOUR_TMDB_API_KEY';
const baseUrl = 'https://api.themoviedb.org/3';

// 发起两个并行请求
Promise.all([
  // 获取正在上映的电影
  fetch(`${baseUrl}/movie/now_playing?api_key=${API_KEY}&language=zh-CN`)
    .then(res => res.json())
    .then(data => data.results),
  // 获取电影类型列表
  fetch(`${baseUrl}/genre/movie/list?api_key=${API_KEY}&language=zh-CN`)
    .then(res => res.json())
    .then(data => data.genres)
])
.then(([movies, genres]) => {
  // 在这里处理数据转换
})
.catch(err => console.error('请求失败:', err));

2. 构建类型ID到名称的映射表 #

把类型列表转成Map（或者普通对象），这样根据ID查名称的时间复杂度是O(1)，比每次遍历数组高效得多：

// 用Map构建映射
const genreMap = new Map(genres.map(genre => [genre.id, genre.name]));

// 或者用普通对象（如果ID是数字/字符串）
// const genreMap = genres.reduce((map, genre) => {
//   map[genre.id] = genre.name;
//   return map;
// }, {});

3. 替换电影的genre_ids为类型名称 #

遍历电影列表，把每个电影的genre_ids数组替换成对应的名称数组，还可以过滤掉不存在的ID（避免出现undefined）：

const moviesWithGenreNames = movies.map(movie => {
  // 把genre_ids转成名称数组，过滤掉找不到的ID
  const genreNames = movie.genre_ids
    .map(id => genreMap.get(id))
    .filter(name => name !== undefined);
  
  // 返回新的电影对象，替换genre_ids为genreNames（或者新增字段）
  return {
    ...movie,
    genre_ids: genreNames, // 直接替换原字段
    // 或者新增一个genre_names字段保留原字段：genre_names: genreNames
  };
});

// 现在moviesWithGenreNames里的每个电影都有类型名称数组了，可以用来渲染模板
console.log(moviesWithGenreNames);

额外提示 #

• 如果需要保留原genre_ids字段，可以新增一个genre_names字段，而不是直接替换，方便后续可能的其他操作。
• 处理请求时要加上错误捕获，避免单个请求失败导致整个流程挂掉。
• TMDB API的language参数可以设置为zh-CN获取中文类型名称，根据你的需求调整。

内容的提问来源于stack exchange，提问作者Guta Flores