J*aScript：根据ID匹配数组并创建新属性

javascript：根据id匹配数组并创建新属性

本文旨在讲解如何使用 J*aScript 匹配两个数组中的 ID，并根据匹配结果在一个数组的对象中创建新的属性。我们将通过一个电影类型匹配的示例，详细介绍实现步骤，并提供可直接运行的代码示例，帮助开发者快速掌握该技巧。

在实际开发中，我们经常会遇到需要根据 ID 关联两个数组的情况。例如，一个数组包含电影信息，其中包含电影类型 ID 列表，另一个数组包含所有电影类型及其对应的 ID。我们需要根据电影类型 ID，将电影类型名称添加到电影信息中。

以下是一个实现此功能的 J*aScript 教程：

实现步骤

循环遍历电影数组： 使用 forEach 方法遍历包含电影信息的数组。
创建新的 genres 属性： 在每个电影对象中创建一个新的 genres 属性，用于存储匹配到的电影类型名称。
映射 genre_ids 数组： 使用 map 方法遍历电影对象中的 genre_ids 数组。
查找匹配的类型 ID： 在 genres 数组中使用 find 方法查找与当前 genre_id 匹配的类型对象。
返回类型名称： 如果找到匹配的类型对象，则返回其 name 属性（即类型名称）。
Facetune
一款在线照片和视频编辑工具，允许用户创建AI头像
109 查看详情
(可选)删除 genre_ids 属性： 如果不再需要 genre_ids 属性，可以使用 delete 运算符将其从电影对象中删除。

代码示例

const genres = [
    { id: 28, name: 'Action' },
    { id: 12, name: 'Adventure' },
    { id: 16, name: 'Animation' },
    { id: 35, name: 'Comedy' },
    { id: 80, name: 'Crime' },
    { id: 99, name: 'Documentary' },
    { id: 18, name: 'Drama' },
    { id: 10751, name: 'Family' },
    { id: 14, name: 'Fantasy' },
];

const movies = [
    {
        genre_ids: [16, 18, 12, 14],
        title: 'Suzume',
    },
];

movies.forEach((movie) => {
    movie.genres = movie.genre_ids.map(
        (id) => genres.find((genre) => id === genre.id).name
    );
    delete movie.genre_ids;
});

console.log(movies);

代码解释

genres 数组包含电影类型 ID 和名称的对应关系。
movies 数组包含电影信息，每个电影对象都有一个 genre_ids 属性，其中包含电影类型 ID 的列表。
forEach 方法遍历 movies 数组，对每个电影对象执行以下操作：
- movie.genre_ids.map(...) 使用 map 方法遍历 genre_ids 数组，将每个 ID 转换为对应的类型名称。
- genres.find((genre) => id === genre.id).name 使用 find 方法在 genres 数组中查找与当前 ID 匹配的类型对象，并返回其 name 属性。
- movie.genres = ... 将类型名称列表赋值给电影对象的 genres 属性。
- delete movie.genre_ids 删除电影对象的 genre_ids 属性。
console.log(movies) 打印修改后的 movies 数组。

注意事项

确保 genres 数组包含所有可能的 genre_ids 值。如果 genre_ids 中存在 genres 数组中没有的 ID，find 方法将返回 undefined，导致错误。可以使用条件判断来处理这种情况，例如：
```
movie.genres = movie.genre_ids.map((id) => {
    const genre = genres.find((genre) => id === genre.id);
    return genre ? genre.name : null; // 或者其他默认值
});
```
find 方法返回的是第一个匹配的元素。如果 genres 数组中存在重复的 ID，只会返回第一个匹配的类型名称。

总结

通过以上步骤，我们可以轻松地根据 ID 匹配两个数组，并根据匹配结果在一个数组的对象中创建新的属性。这种方法在处理关联数据时非常有用，可以提高代码的可读性和可维护性。在实际应用中，可以根据具体需求进行适当的调整和优化。

以上就是J*aScript：根据ID匹配数组并创建新属性的详细内容，更多请关注其它相关文章！

# 建新 # 南海SEO怎么做 # 徐汇区餐饮营销推广 # 怎样推广图片网站 # 杭州seo关键词公司 # 上海翻译网站建设 # 兴化seo优化欢迎咨询 # 电商推广营销报告 # 萝卜推广app网站下载 # 银行网站怎样建设和运行 # 财税行业关键词搜索排名 # javascript # 象中 # 键值 # 最短 # 在一 # 可以使用 # 运算符 # 第一个 # 组中 # 遍历 # java

相关栏目：【 Google疑问12 】【 Facebook疑问10 】【优化推广96088 】【技术知识133117 】【 IDC资讯59369 】【网络运营7196 】【 IT资讯61894 】

2025-10-09

4008744355

J*aScript：根据ID匹配数组并创建新属性

了解您产品搜索量及市场趋势，制定营销计划

同行竞争及网站分析保障您的广告效果

提交您的需求，1小时内享受我们的专业解答。

运城市盐湖区信雨科技有限公司

4008744355

服务/方案/案例/支持

关于我们

Notice