高效处理大型对象数组:TypeScript 优化技巧

高效处理大型对象数组:typescript 优化技巧

本文将介绍一种在 TypeScript 中高效处理两个大型对象数组的方法,目标是将一个数组(marks)中的特定属性(marks和grade)合并到另一个数组(students)中,基于共同的id字段。 传统方法使用嵌套循环会导致 O(n*m) 的时间复杂度,当数组规模较大时,性能会显著下降。本文将介绍如何利用 Map 数据结构和空值合并赋值运算符优化这一过程,将时间复杂度降低到 O(n+m)。

优化思路

核心思想是将 students 数组转换为一个 Map 对象,其中 key 为 id,value 为对应的学生对象。这样,在遍历 marks 数组时,可以直接通过 id 从 Map 中查找对应的学生对象,从而避免了内层循环。此外,利用空值合并赋值运算符 ??=,可以安全地更新学生对象的 marks 和 grade 属性,避免覆盖已有的非空值。

实现步骤

将 students 数组转换为 Map 对象:

const studentMap = new Map(students.map(student => [student.id, { ...student }]));

这段代码使用 Array.map() 方法将 students 数组的每个元素转换为一个键值对,其中 key 为 student.id,value 为学生对象的浅拷贝。然后,使用 new Map() 构造函数创建一个 Map 对象。浅拷贝 …student 可以避免修改原始的 students 数组。

遍历 marks 数组,更新 studentMap 中的学生对象:

marks.forEach(mark => {    const student = studentMap.get(mark.id);    if (student) {        if (mark.grade !== null) {            student.grade ??= mark.grade;        }        if (mark.marks !== null) {            student.marks ??= mark.marks;        }    }});

这段代码使用 Array.forEach() 方法遍历 marks 数组。对于每个 mark 对象,首先通过 studentMap.get(mark.id) 查找对应的学生对象。如果找到,则使用空值合并赋值运算符 ??= 更新 student.grade 和 student.marks 属性。??= 运算符只有在左侧操作数为 null 或 undefined 时,才会将右侧操作数赋值给左侧操作数。这确保了我们只更新学生对象的空值属性,而不会覆盖已有的非空值。

将 Map 对象转换为数组:

const result = Array.from(studentMap.values());

最后,使用 Array.from(studentMap.values()) 将 Map 对象的值转换为数组。

完整代码示例

const marks = [    { "id": 1, "marks": null, "grade": "A" },    { "id": 1, "marks": 90, "grade": null },    { "id": 1, "marks": 90, "grade": "A" },    { "id": 2, "marks": 65, "grade": "B" }];const students = [    { "id": 1, "name": "john" },    { "id": 2, "name": "anna" }];const studentMap = new Map(students.map(student => [student.id, { ...student }]));marks.forEach(mark => {    const student = studentMap.get(mark.id);    if (student) {        if (mark.grade !== null) {            student.grade ??= mark.grade;        }        if (mark.marks !== null) {            student.marks ??= mark.marks;        }    }});const result = Array.from(studentMap.values());console.log(result);

性能分析

将 students 数组转换为 Map 对象: O(n)遍历 marks 数组,更新 studentMap 中的学生对象: O(m)将 Map 对象转换为数组: O(n)

因此,总的时间复杂度为 O(n) + O(m) + O(n) = O(n + m)。 空间复杂度主要取决于 studentMap 的大小,为 O(n)。

注意事项

确保 id 字段在两个数组中都存在且唯一,否则可能导致数据合并错误。如果 students 数组非常大,可以考虑使用更高效的 Map 实现,例如使用第三方库提供的 Map。空值合并赋值运算符 ??= 是 ES2020 引入的特性,如果需要兼容旧版本的 JavaScript,可以使用传统的 if 语句来实现相同的功能。

总结

通过将 students 数组转换为 Map 对象,并结合空值合并赋值运算符,我们可以显著提高处理大型对象数组的效率,将时间复杂度从 O(n*m) 降低到 O(n+m)。 这种方法适用于需要根据共同字段合并两个数组的场景,并且可以轻松地应用于其他类似的问题。

以上就是高效处理大型对象数组:TypeScript 优化技巧的详细内容,更多请关注创想鸟其它相关文章!

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。
如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至 chuangxiangniao@163.com 举报,一经查实,本站将立刻删除。
发布者:程序猿,转转请注明出处:https://www.chuangxiangniao.com/p/1509172.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
TestCafe 中 Selector 与常量运算导致预期失败的原因及解决方案
上一篇 2025年12月20日 05:19:09
高效处理大型 TypeScript 对象数组:基于 ID 合并数据
下一篇 2025年12月20日 05:19:17

相关推荐

  • 深入理解 Laravel Session::put:避免常见陷阱与实现表单限流

    本文旨在深入探讨 laravel 框架中 `session::put` 方法的正确用法及其常见误区。针对用户在实现表单提交限流时遇到的问题,详细阐述了 `session::put` 必须提供键值对的原理,并提供了如何在控制器中利用会话机制有效防止重复提交的实战代码示例。通过本文,读者将掌握 lara…

    2026年5月10日
    000
  • JS注解怎么和TypeScript结合_ JS注解在TypeScript环境下的应用

    TypeScript 支持通过配置 allowJs 和 checkJs 在 JavaScript 文件中识别 JSDoc 注解并进行类型检查,可在混合项目中提升类型安全;常见用法包括 @type、@param、@returns 和 @typedef,能为变量、函数参数等提供类型信息,支持与 .ts …

    2026年5月10日
    000
  • jQuery对象类型判断机制详解:toType函数如何精准识别对象类型?

    深入解析jquery对象类型判断机制:totype函数详解 本文将深入剖析jQuery中用于精准识别对象类型的toType函数,并详细解释其核心代码片段。该函数旨在判断传入对象的类型并返回其类型字符串。 核心代码如下: var class2type = {};var toString = class…

    2026年5月10日
    000
  • JavaScript中为动态列表元素创建唯一悬停描述的教程

    本教程旨在解决如何为动态生成的列表或数组元素分配唯一悬停描述(tooltip)的问题。文章将深入探讨使用javascript对象和map数据结构来高效地管理名称与描述的映射关系,并提供具体的代码示例,以实现每个列表项在鼠标悬停时显示不同的自定义信息,同时兼顾性能与数据顺序的需求。 在网页开发中,我们…

    2026年5月10日
    000
  • PHP中通过键名高效关联与输出多维数组数据

    本教程旨在解决php开发中常见的数据关联与输出问题,特别是当需要将不同数组中通过共同键名关联的数据进行整合展示时。文章将详细阐述如何利用foreach循环的键值对特性,结合array_key_exists函数,实现从多个数组中提取并组合相关信息,从而避免不必要的嵌套循环,提升代码的清晰度和执行效率。…

    2026年5月10日
    000
  • python中怎么删除字典中的键值对_Python删除字典元素的方法

    删除字典键值对有四种方法:del语句删除指定键,pop()删除键并返回值,popitem()随机删除键值对,clear()清空字典。 在 Python 中,删除字典中的键值对主要有几种方式:使用 del 语句直接删除指定键,利用 pop() 方法删除指定键并获取其对应的值,或者通过 popitem(…

    2026年5月10日
    000
  • 怎样用Golang实现一个简单的键值存储 基于文件持久化方案

    怎样用Golang实现一个简单的键值存储 基于文件持久化方案怎样用Golang实现一个简单的键值存储 基于文件持久化方案怎样用Golang实现一个简单的键值存储 基于文件持久化方案怎样用Golang实现一个简单的键值存储 基于文件持久化方案

    要实现一个简单的键值存储系统,需结合golang与文件持久化方案。1. 使用map[string]string作为内存数据结构,选择json或gob进行序列化;2. 围绕map实现crud操作,写入后立即或定时刷新到磁盘,并在启动时加载数据;3. 文件策略可选每次写入刷盘、定时异步刷盘或日志记录变更…

    2026年5月10日 用户投稿
    000
  • TypeScript函数体中如何高效判断参数类型?

    typescript 函数体中判断参数类型的技巧 typescript 中,我们可以定义接口来表示不同的数据类型。在本文中,我们将探讨如何在函数体中判断参数的类型,从而实现类型收窄,进行更精细的类型检查。 使用谓词函数 一种方法是编写谓词函数来手动检查类型。谓词函数返回的是 value is som…

    2026年5月10日
    000
  • JS如何实现策略模式

    策略模式通过封装算法使其可互换,JavaScript中利用函数作为一等公民实现,适用于表单验证等场景,结合工厂模式提升灵活性,但应避免过度设计。 策略模式的核心在于定义一系列算法,并将每一个算法封装起来,使它们可以相互替换。这使得算法可以在不影响客户端的情况下发生变化。在JS中,这可以通过函数作为一…

    2026年5月10日
    000
  • C++ 数据结构指南:理清复杂数据组织之道

    答案: c++++ 数据结构是组织和管理数据的构建块,优化检索和处理。常见结构:数组:有序集合,通过索引访问向量:动态数组,快速插入和删除链表:灵活插入和删除堆栈:lifo 原则队列:fifo 原则树:分层结构哈希表:快速键值查找应用: 数据存储、算法设计、图形处理、人工智能等。实战案例: 使用学生…

    2026年5月10日
    000
  • Svelte中正确导入数据与组件:避免常见误区

    在svelte开发中,理解如何正确导入数据和组件至关重要。svelte文件定义的是组件而非普通javascript模块,若需共享纯数据,应使用`.js`文件进行导出。本文将详细阐述svelte的导入机制,并通过示例代码展示如何区分导入数据与渲染组件,从而避免常见的导入错误,确保项目结构清晰且功能正确…

    2026年5月10日
    300
  • 从LocalStorage中获取并显示特定JSON对象属性的教程

    本文详细介绍了如何从浏览器localstorage中检索存储为json字符串的复杂数据,并提取其中的特定属性值以显示在网页元素中。核心方法是使用`json.parse()`将存储的字符串转换回javascript对象,然后通过点或方括号语法访问所需属性。文章还提供了示例代码和错误处理建议,确保数据获…

    2026年5月10日
    100
  • 如何通过GitHub API高效获取超过100个用户列表(分页教程)

    本教程旨在解决使用GitHub API获取用户列表时遇到的默认100个用户限制问题。我们将详细介绍两种主要的分页策略:利用Octokit库内置的paginate方法实现自动化分页,以及手动实现基于since参数的循环分页逻辑。文章将提供清晰的代码示例,并强调在不同场景下选择合适方法的注意事项,特别是…

    2026年5月10日
    000
  • 前端构建优化:利用常量折叠提升应用性能

    本文深入探讨了一种在构建阶段执行部分源代码以进行优化的技术——常量折叠(Constant Folding)。通过在编译时预计算表达式并替换为最终结果,该技术显著减少了运行时开销,提升了应用性能。文章将详细解释其工作原理、优势,并探讨其在现代前端构建工具中的应用与配置,旨在帮助开发者实现更高效的代码优…

    2026年5月10日
    000
  • JavaScript数据结构实现_javascript算法基础

    JavaScript中常用数据结构包括栈、链表和字典:1. 栈利用数组的push和pop实现LIFO,适用于括号匹配;2. 链表由节点组成,插入删除高效,适合频繁修改场景;3. 字典用对象实现键值对存储,常用于频率统计;4. 二分查找在有序数组中以O(log n)效率查找目标值,需数组已排序。掌握这…

    2026年5月10日
    000
  • 动态语言中静态类型的讽刺

    c++kquote>您也可以在 medium 上阅读这篇文章。 当我们看到编程语言如何随着时间的推移而演变时,总是很有趣。 曾几何时,当我开始进入软件开发世界时,python、php 和 javascript 等动态语言因其灵活性和适合快速开发的简洁语法而受到赞赏。 然而,随着这些弱类型语言的…

    2026年5月10日
    000
  • 为什么 TypeScript 比 JavaScript 更好

    javascript 长期以来一直是 web 开发的基石,支持从小型脚本到大型应用程序的各种项目。然而,随着项目规模的扩大,javascript 的动态类型和缺乏结构性可能会成为开发的瓶颈。typescript 应运而生,它凭借静态类型检查和强大的工具集,迅速成为许多开发者构建可靠、可扩展应用程序的…

    2026年5月10日
    100
  • 深入解析Angular中循环计算与数组操作的常见陷阱及优化实践

    本文深入探讨了angular应用中处理循环计算和动态数组时常见的逻辑错误。通过一个租金计算器示例,我们分析了`for`循环中未能正确累加迭代值以及数组填充不当的问题,并提供了详细的解决方案,包括优化计算逻辑、正确使用数组`push`方法,以及遵循typescript和javascript的最佳实践,…

    2026年5月10日
    000
  • python中del是什么意思 python中del删除对象的用法解析

    在python中,del用于删除对象的引用。1)删除变量:del x会移除变量x的引用,导致x不再存在。2)删除列表元素:del my_list[2]会删除索引为2的元素。3)删除列表切片:del my_list[1:3]会删除指定范围内的元素。4)删除字典键值对:del my_dict[&#821…

    2026年5月10日
    000
  • Laravel Session::put 正确用法详解与常见误区规避

    本文详细探讨了 laravel 中 `session::put` 方法的正确用法,特别指出在仅提供键名而未指定值时可能导致会话数据未被正确设置的问题。通过示例代码,阐述了如何为会话数据赋予明确的值,并演示了如何正确地检查和获取会话数据,以确保会话管理功能按预期工作,有效避免常见的会话操作错误。 La…

    2026年5月10日
    000

发表回复

登录后才能评论
关注微信