如何在JavaScript中过滤含视频的Twitter状态并重命名字段？

推荐：分两步（Filter + Map） #

分两步处理是最优选择，代码清晰易读，出错时更容易定位问题：

1. 过滤无视频条目：先筛选出包含有效视频的status，需要验证以下几个条件：

   • 存在extended_entities字段
   • extended_entities.media是非空数组
   • 数组中至少有一个media条目包含video_info.variants（确保是视频而非图片）

2. 映射重命名字段：对过滤后的条目进行字段映射，将视频URL重命名为sources，同时安全访问嵌套字段避免报错。

完整代码示例

// 第一步：过滤含视频的status
const filteredStatuses = data.statuses.filter(item => {
  // 基础字段校验
  if (!item.extended_entities || !item.extended_entities.media || item.extended_entities.media.length === 0) {
    return false;
  }
  // 检查是否存在视频类型的media
  return item.extended_entities.media.some(media => media.video_info?.variants?.length > 0);
});

// 第二步：映射并重命名字段
const new_Data = filteredStatuses.map(item => {
  // 找到第一个有效视频media
  const videoMedia = item.extended_entities.media.find(media => media.video_info?.variants?.length > 0);
  const videoUrl = videoMedia?.video_info?.variants[0]?.url;

  return {
    id: item.id,
    subtitle: item.text,
    sources: videoUrl,
    tweetURL: `https://twitter.com/${item.user.screen_name}/status/${item.id_str}`,
    name: item.user.name,
    username: item.user.screen_name,
    thumb: item.user.profile_image_url,
    userUrl: `https://twitter.com/${item.user.screen_name}`
  };
});

一步实现的可选方案（不推荐） #

虽然可以用reduce将过滤和映射合并为一步，但代码可读性会显著下降，仅适合追求极致简洁的场景：

const new_Data = data.statuses.reduce((acc, item) => {
  // 跳过无视频的条目
  if (!item.extended_entities || !item.extended_entities.media || item.extended_entities.media.length === 0) {
    return acc;
  }
  const videoMedia = item.extended_entities.media.find(media => media.video_info?.variants?.length > 0);
  if (!videoMedia) {
    return acc;
  }

  // 映射字段并加入结果数组
  acc.push({
    id: item.id,
    subtitle: item.text,
    sources: videoMedia.video_info.variants[0].url,
    tweetURL: `https://twitter.com/${item.user.screen_name}/status/${item.id_str}`,
    name: item.user.name,
    username: item.user.screen_name,
    thumb: item.user.profile_image_url,
    userUrl: `https://twitter.com/${item.user.screen_name}`
  });
  return acc;
}, []);

总结 #

优先选择Filter + Map的分两步方案，代码逻辑清晰，后续维护、调试都更高效。除非有特殊的性能需求（实际场景中两者性能差异可忽略），否则不建议用reduce合并。

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