0

0

如何在 Node.js 中基于公共字段合并多个数组的数据

碧海醫心

碧海醫心

发布时间:2026-01-12 18:24:01

|

461人浏览过

|

来源于php中文网

原创

如何在 Node.js 中基于公共字段合并多个数组的数据

本文介绍如何将嵌套的二维用户数据数组按 `class_id` 字段归并,生成每个班级对应学生列表的标准结构,使用 `flat()` + `reduce()` + 对象键映射实现高效、健壮的分组聚合。

在 Node.js(或现代浏览器环境)中处理多层嵌套的数组数据时,常见的需求是按某个公共字段(如 class_id)对扁平化后的记录进行分组聚合。原始数据为二维数组,每项是一个班级的学生子数组,但其中可能存在跨子数组的相同 class_id(例如 "Grade 2" 出现在第二个子数组的第 0 和第 2 个元素),因此不能简单按外层数组索引处理——必须先展平,再统一归类。

✅ 推荐解决方案:flat() + reduce() 构建哈希映射

核心思路是:

  1. 使用 Array.prototype.flat() 将二维数组转为一维学生对象数组;
  2. 利用 reduce() 遍历每个学生对象,以 class_id 为键,在累加器(普通对象)中动态创建/复用班级分组;
  3. 每次将精简后的学生信息 { roll_number, name } 推入对应班级的 students 数组;
  4. 最后通过 Object.values() 提取所有分组对象,得到目标格式的数组。

以下是完整可运行代码示例:

百度文心一格
百度文心一格

百度推出的AI绘画作图工具

下载
const data = [
  [
    { class_id: "Grade 1", roll_number: "1", name: "alex" },
    { class_id: "Grade 1", roll_number: "2", name: "bob" },
  ],
  [
    { class_id: "Grade 2", roll_number: "7", name: "peter" },
    { class_id: "Grade 3", roll_number: "6", name: "lia" },
    { class_id: "Grade 2", roll_number: "5", name: "mary" },
    { class_id: "Grade 3", roll_number: "1", name: "violet" },
  ],
];

const result = data
  .flat() // → [{...}, {...}, {...}, ...]
  .reduce((acc, { class_id, roll_number, name }) => {
    // 若该 class_id 尚未初始化,则创建默认结构
    acc[class_id] ??= { class_id, students: [] };
    // 向对应班级的学生数组添加精简对象
    acc[class_id].students.push({ roll_number, name });
    return acc;
  }, {});

// 转换为最终所需的数组格式
const groupedByClass = Object.values(result);
console.log(groupedByClass);
? 输出结果完全匹配需求:[ { "class_id": "Grade 1", "students": [{ "roll_number": "1", "name": "alex" }, { "roll_number": "2", "name": "bob" }] }, { "class_id": "Grade 2", "students": [{ "roll_number": "7", "name": "peter" }, { "roll_number": "5", "name": "mary" }] }, { "class_id": "Grade 3", "students": [{ "roll_number": "6", "name": "lia" }, { "roll_number": "1", "name": "violet" }] } ]

⚠️ 注意事项与最佳实践

  • 兼容性考虑:Array.prototype.flat() 和 ??=(Nullish Coalescing Assignment)均需 Node.js ≥ 12(推荐 ≥ 14.17+)或现代浏览器支持。若需兼容旧环境,可用 [].concat(...data) 替代 flat(),用 acc[class_id] = acc[class_id] || { class_id, students: [] } 替代 ??=。
  • 字段健壮性:实际项目中建议增加空值校验(如 class_id && typeof class_id === 'string'),避免因脏数据导致 acc[undefined] 等异常。
  • 性能优势:该方案时间复杂度为 O(n),仅遍历一次扁平化数组,远优于嵌套循环或多次 filter() 的低效方式。
  • 扩展性友好:如后续需添加 teacher、subject_count 等班级级汇总字段,只需在 acc[class_id] 初始化逻辑中补充即可,结构清晰易维护。

此方法兼顾简洁性、可读性与工程鲁棒性,是 Node.js 中处理同类“多源同构数据聚合”任务的标准范式。

相关专题

更多
string转int
string转int

在编程中,我们经常会遇到需要将字符串(str)转换为整数(int)的情况。这可能是因为我们需要对字符串进行数值计算,或者需要将用户输入的字符串转换为整数进行处理。php中文网给大家带来了相关的教程以及文章,欢迎大家前来学习阅读。

315

2023.08.02

js正则表达式
js正则表达式

php中文网为大家提供各种js正则表达式语法大全以及各种js正则表达式使用的方法,还有更多js正则表达式的相关文章、相关下载、相关课程,供大家免费下载体验。

510

2023.06.20

js获取当前时间
js获取当前时间

JS全称JavaScript,是一种具有函数优先的轻量级,解释型或即时编译型的编程语言;它是一种属于网络的高级脚本语言,主要用于Web,常用来为网页添加各式各样的动态功能。js怎么获取当前时间呢?php中文网给大家带来了相关的教程以及文章,欢迎大家前来学习阅读。

244

2023.07.28

js 字符串转数组
js 字符串转数组

js字符串转数组的方法:1、使用“split()”方法;2、使用“Array.from()”方法;3、使用for循环遍历;4、使用“Array.split()”方法。本专题为大家提供js字符串转数组的相关的文章、下载、课程内容,供大家免费下载体验。

254

2023.08.03

js是什么意思
js是什么意思

JS是JavaScript的缩写,它是一种广泛应用于网页开发的脚本语言。JavaScript是一种解释性的、基于对象和事件驱动的编程语言,通常用于为网页增加交互性和动态性。它可以在网页上实现复杂的功能和效果,如表单验证、页面元素操作、动画效果、数据交互等。

5267

2023.08.17

js删除节点的方法
js删除节点的方法

js删除节点的方法有:1、removeChild()方法,用于从父节点中移除指定的子节点,它需要两个参数,第一个参数是要删除的子节点,第二个参数是父节点;2、parentNode.removeChild()方法,可以直接通过父节点调用来删除子节点;3、remove()方法,可以直接删除节点,而无需指定父节点;4、innerHTML属性,用于删除节点的内容。

475

2023.09.01

js截取字符串的方法
js截取字符串的方法

js截取字符串的方法有substring()方法、substr()方法、slice()方法、split()方法和slice()方法。本专题为大家提供字符串相关的文章、下载、课程内容,供大家免费下载体验。

206

2023.09.04

Js中concat和push的区别
Js中concat和push的区别

Js中concat和push的区别:1、concat用于将两个或多个数组合并成一个新数组,并返回这个新数组,而push用于向数组的末尾添加一个或多个元素,并返回修改后的数组的新长度;2、concat不会修改原始数组,是创建新的数组,而push会修改原数组,将新元素添加到原数组的末尾等等。本专题为大家提供concat和push相关的文章、下载、课程内容,供大家免费下载体验。

217

2023.09.14

Java 项目构建与依赖管理(Maven / Gradle)
Java 项目构建与依赖管理(Maven / Gradle)

本专题系统讲解 Java 项目构建与依赖管理的完整体系,重点覆盖 Maven 与 Gradle 的核心概念、项目生命周期、依赖冲突解决、多模块项目管理、构建加速与版本发布规范。通过真实项目结构示例,帮助学习者掌握 从零搭建、维护到发布 Java 工程的标准化流程,提升在实际团队开发中的工程能力与协作效率。

10

2026.01.12

热门下载

更多
网站特效
/
网站源码
/
网站素材
/
前端模板

精品课程

更多
相关推荐
/
热门推荐
/
最新课程
WEB前端教程【HTML5+CSS3+JS】
WEB前端教程【HTML5+CSS3+JS】

共101课时 | 8.2万人学习

JS进阶与BootStrap学习
JS进阶与BootStrap学习

共39课时 | 3.1万人学习

关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送

Copyright 2014-2026 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号