当前位置: 首页 > news >正文

js 多对象去重(多属性去重)

需求中发现后端可能没有处理重复数据,这个时候前段可以直接解决。

在 JavaScript 中,可以使用 Set 数据结构来进行多对象的去重。Set 是 ES6 新引入的集合类型,其特点是元素不会重复且无序。

下面是一个示例代码,展示如何通过 Set 进行多对象的去重操作:

// 定义包含重复对象的数组
const arr = [{ id: 1, name: 'Alice' },{ id: 2, name: 'Bob' },{ id: 3, name: 'Charlie' },{ id: 4, name: 'Dave' },{ id: 5, name: 'Eve' },{ id: 1, name: 'Alice' },{ id: 2, name: 'Bob' },{ id: 3, name: 'Charlie' },// ...
];// 创建一个空的 Set 对象
const set = new Set();// 遍历原始数组,将每个对象添加到 Set 中
arr.forEach(obj => {set.add(JSON.stringify(obj));
});// 转换为数组并输出结果
const resultArr = Array.from(set).map(strObj => JSON.parse(strObj));
console.log(resultArr);

上述代码首先创建了一个空的 Set 对象 set,然后利用 forEach() 方法遍历原始数组 arr,将每个对象转化成字符串形式(使用 JSON.stringify())再添加到 Set 中。最后,通过调用 Array.from() 方法将 Set 转换为数组,并使用 map() 方法将字符串形式的对象还原为真正的对象。

这样就完成了多对象的去重操作,得到的 resultArr 数组中只保留了没有重复的对象。

实例
在这里插入图片描述
处理后的数据对象

在这里插入图片描述

	newData = res.datanewData?.reverse().forEach((item, i) => {if(item.startStopRecord && item.startStopRecord.length > 0) {let arr = item.startStopRecord       // 创建一个空的 Set 对象const set = new Set();        // 遍历原始数组,将每个对象添加到 Set 中arr.forEach(obj => {set.add(JSON.stringify(obj));});        // 转换为数组并输出结果const resultArr = Array.from(set).map(strObj => JSON.parse(strObj));console.log(resultArr, 'resultArr');// let newresultArr =[]// resultArr.forEach((v, index )=> {//   if(v.startTime > v.endTime){//     v.startTime  = v?.[index-1]?.endTime //     v.endTime = v?.[index]?.endTime //   }//   newresultArr.push(v)// })}})

如果是判断多个属性去重也可以用这个方法
在这里插入图片描述

const arr = [{ id: 1, name: 'Alice' },{ id: 2, name: 'Bob' },{ id: 3, name: 'Charlie' },{ id: 4, name: 'Alice' }
];// 根据id和name两个属性进行去重
const uniqueArr = Array.from(new Set(arr.map((item) => JSON.stringify([item.id, item.name]))));
console.log(uniqueArr); // ["[1,\"Alice\"]", "[2,\"Bob\"]", "[3,\"Charlie\"]"]
// 还原成对象格式
const result = uniqueArr.map((str) => JSON.parse(str)).map(([id, name]) => ({ id, name }));
console.log(result); // [{ id: 1, name: "Alice" },{ id: 2, name: "Bob" },{ id: 3, name: "Charlie" }]

相关文章:

js 多对象去重(多属性去重)

需求中发现后端可能没有处理重复数据,这个时候前段可以直接解决。 在 JavaScript 中,可以使用 Set 数据结构来进行多对象的去重。Set 是 ES6 新引入的集合类型,其特点是元素不会重复且无序。 下面是一个示例代码,展示如何通过 S…...

在 JavaScript 中,Map 与 object 的差别?为什么有 object 还需要 Map?

ES6 推出了Map 物件,让开发者可以透过这个特制资料结构进行键值对(key-value pairs) 的操作。然而 JavaScript 原始物件 (plain object) 就可以用来做键值对的操作,为什么还需要 Map 物件呢? Map 物件解决了什么问题? 原始物件的键 (key) 只可以是字串…...

【研究生复试】计算机软件工程人工智能研究生复试——资料整理(速记版)——自我介绍(英文)

1、JAVA 2、计算机网络 3、计算机体系结构 4、数据库 5、计算机租场原理 6、软件工程 7、大数据 8、英文 自我介绍 自我介绍 英文 自我介绍 英文 第一段: Good afternoon, dear professors, thank you for the chance to introduce myself. My name is Yan Zhen …...

ACP科普:IDEAL含义及应用

一、IDEAL介绍 IDEAL模型是一种组织改进模型,描述了组织在实施变革过程中可能经历的五个阶段: 启动诊断确立执行学习 这个模型可以应用于各种组织,包括软件开发团队、项目管理团队以及整个组织的变革过程。 二、IDEAL拆解 当应用IDEAL模型…...

【GO语言卵细胞级别教程】06.GO语言的字符串操作

【GO语言卵细胞级别教程】06.GO语言的字符串操作 温馨提示: 本文中使用的项目模块均是 【05.项目创建和函数讲解】 中创建的,具体如何创建项目,请参考 【GO语言卵细胞级别教程】05.项目创建和函数讲解 目录: 【GO语言卵细胞级别…...

【笔记】【算法设计与分析 - 北航童咏昕教授】绪论

算法设计与分析 - 北航童咏昕教授 文章目录 算法的定义定义性质 算法的表示自然语言编程语言伪代码 算法的分析算法分析的原则渐近分析 算法的定义 定义 给定计算问题,算法是一系列良定义的计算步骤,逐一执行计算步骤即可得预期的输出。 性质 有穷性确…...

大语言模型LLM中Transformer模型的调用过程与步骤

在LLM(Language Model)中,Transformer是一种用来处理自然语言任务的模型架构。下面是Transformer模型中的调用过程和步骤的简要介绍: 数据预处理:将原始文本转换为模型可以理解的数字形式。这通常包括分词、编码和填充…...

mysql connect unblock with mysqladmin flush-hosts

原因 同一个ip在短时间内产生太多(超过max_connect_errors的最大值)中断的数据库连接而导致的阻塞。 查看 max_connect_errors show variables like max_connect_errors; 解决 前提:需要换一个IP地址连接 方法一 增大 max_connect_err…...

每日一练:前端js实现算法之两数之和

方法一&#xff1a;暴力法 function twoSum(nums, target) {for (let i 0; i < nums.length; i) {for (let j i 1; j < nums.length; j) {if (nums[i] nums[j] target) {return [i, j];}}}return null; }方法二&#xff1a;哈希表 function twoSum(nums, target) …...

17.隐式参数的定义和使用

目录 概述实践代码执行 结束 概述 实践 代码 package com.fun.scalaobject ImplicitParamsApp {def main(args: Array[String]): Unit {say("天下")implicit val word "spark"// 多个报错 // implicit val word2 "flink"implicit val con…...

简单介绍一下WebRTC中NACK机制

WebRTC中的NACK&#xff08;Negative Acknowledgement&#xff09;是一种用于实时通信的网络协议&#xff0c;用于在传输过程中检测和纠正丢包。当接收方检测到数据包丢失时&#xff0c;它会发送一个NACK消息给发送方&#xff0c;请求重新发送丢失的数据包。 NACK的工作原理如…...

05 Flink 的 WordCount

前言 本文对应于 spark 系列的 Spark 的 WordCount 这里主要是 从宏观上面来看一下 flink 这边的几个角色, 以及其调度的整个流程 一个宏观 大局上的任务的处理, 执行 基于 一个本地的 flink 集群 测试用例 /*** com.hx.test.Test01WordCount** author Jerry.X.He* ver…...

2024云服务器ECS_云主机_服务器托管_e实例-阿里云

阿里云服务器ECS英文全程Elastic Compute Service&#xff0c;云服务器ECS是一种安全可靠、弹性可伸缩的云计算服务&#xff0c;阿里云提供多种云服务器ECS实例规格&#xff0c;如ECS经济型e实例、通用算力型u1、ECS计算型c7、通用型g7、GPU实例等&#xff0c;阿里云服务器网al…...

掌握这8大工具,自媒体ai写作之路畅通无阻! #经验分享#科技#媒体

这些宝藏AI 写作神器&#xff0c;我不允许你还不知道~国内外免费付费都有&#xff0c;还有AI写作小程序分享&#xff0c;大幅度提高写文章、写报告的效率&#xff0c;快来一起试试吧&#xff01; 1.元芳写作 这是一个微信公众号 面向专业写作领域的ai写作工具&#xff0c;写作…...

CTFHub技能树web之文件上传(一)

一.前置知识 文件上传漏洞&#xff1a;文件上传功能是许多Web应用程序的常见功能之一&#xff0c;但在实施不当的情况下&#xff0c;可能会导致安全漏洞。文件上传漏洞的出现可能会使攻击者能够上传恶意文件&#xff0c;执行远程代码&#xff0c;绕过访问控制等。 文件类型验证…...

蔚来面试解答

你的问题包含了多个方面&#xff0c;我会尽力逐一回答&#xff1a; 锁机制及锁膨胀过程&#xff1a; 锁机制是并发编程中用于控制多线程对共享资源访问的一种机制&#xff0c;以避免资源冲突导致的数据不一致问题。锁膨胀是指锁在运行时根据竞争情况可以升级的过程&#xff0c;…...

Springboot 中使用 Redisson+AOP+自定义注解 实现访问限流与黑名单拦截

&#x1f3f7;️个人主页&#xff1a;牵着猫散步的鼠鼠 &#x1f3f7;️系列专栏&#xff1a;Java全栈-专栏 &#x1f3f7;️个人学习笔记&#xff0c;若有缺误&#xff0c;欢迎评论区指正 前些天发现了一个巨牛的人工智能学习网站&#xff0c;通俗易懂&#xff0c;风趣幽默&…...

Java使用企业邮箱发送预警邮件

前言&#xff1a;最近接到一个需求&#xff0c;需要根据所监控设备的信息&#xff0c;在出现问题时发送企业微信进行预警。 POM依赖 <!-- 邮件 --> <dependency><groupId>com.sun.mail</groupId><artifactId>jakarta.mail</artifactId>…...

Unity编辑器扩展之是否勾选Text组件BestFit选项工具(此篇教程也可以操作其他组件的属性)

想要批量化是否勾选项目预制体资源中Text组件BestFit属性&#xff08;此篇教程也可以操作其他组件的属性&#xff0c;只不过需要修改其中对应的代码&#xff09;&#xff0c;可以采用以下步骤。 1、在项目的Editor文件中&#xff0c;新建一个名为TextBestFitBatchProcessor的…...

分布式场景怎么Join | 京东云技术团队

背景 最近在阅读查询优化器的论文&#xff0c;发现System R中对于Join操作的定义一般分为了两种&#xff0c;即嵌套循环、排序-合并联接。在原文中&#xff0c;更倾向使用排序-合并联接逻辑。 考虑到我的领域是在处理分库分表或者其他的分区模式&#xff0c;这让我开始不由得…...

【kafka】Golang实现分布式Masscan任务调度系统

要求&#xff1a; 输出两个程序&#xff0c;一个命令行程序&#xff08;命令行参数用flag&#xff09;和一个服务端程序。 命令行程序支持通过命令行参数配置下发IP或IP段、端口、扫描带宽&#xff0c;然后将消息推送到kafka里面。 服务端程序&#xff1a; 从kafka消费者接收…...

React Native 导航系统实战(React Navigation)

导航系统实战&#xff08;React Navigation&#xff09; React Navigation 是 React Native 应用中最常用的导航库之一&#xff0c;它提供了多种导航模式&#xff0c;如堆栈导航&#xff08;Stack Navigator&#xff09;、标签导航&#xff08;Tab Navigator&#xff09;和抽屉…...

java调用dll出现unsatisfiedLinkError以及JNA和JNI的区别

UnsatisfiedLinkError 在对接硬件设备中&#xff0c;我们会遇到使用 java 调用 dll文件 的情况&#xff0c;此时大概率出现UnsatisfiedLinkError链接错误&#xff0c;原因可能有如下几种 类名错误包名错误方法名参数错误使用 JNI 协议调用&#xff0c;结果 dll 未实现 JNI 协…...

vue3 字体颜色设置的多种方式

在Vue 3中设置字体颜色可以通过多种方式实现&#xff0c;这取决于你是想在组件内部直接设置&#xff0c;还是在CSS/SCSS/LESS等样式文件中定义。以下是几种常见的方法&#xff1a; 1. 内联样式 你可以直接在模板中使用style绑定来设置字体颜色。 <template><div :s…...

聊一聊接口测试的意义有哪些?

目录 一、隔离性 & 早期测试 二、保障系统集成质量 三、验证业务逻辑的核心层 四、提升测试效率与覆盖度 五、系统稳定性的守护者 六、驱动团队协作与契约管理 七、性能与扩展性的前置评估 八、持续交付的核心支撑 接口测试的意义可以从四个维度展开&#xff0c;首…...

SAP学习笔记 - 开发26 - 前端Fiori开发 OData V2 和 V4 的差异 (Deepseek整理)

上一章用到了V2 的概念&#xff0c;其实 Fiori当中还有 V4&#xff0c;咱们这一章来总结一下 V2 和 V4。 SAP学习笔记 - 开发25 - 前端Fiori开发 Remote OData Service(使用远端Odata服务)&#xff0c;代理中间件&#xff08;ui5-middleware-simpleproxy&#xff09;-CSDN博客…...

#Uniapp篇:chrome调试unapp适配

chrome调试设备----使用Android模拟机开发调试移动端页面 Chrome://inspect/#devices MuMu模拟器Edge浏览器&#xff1a;Android原生APP嵌入的H5页面元素定位 chrome://inspect/#devices uniapp单位适配 根路径下 postcss.config.js 需要装这些插件 “postcss”: “^8.5.…...

Yolov8 目标检测蒸馏学习记录

yolov8系列模型蒸馏基本流程&#xff0c;代码下载&#xff1a;这里本人提交了一个demo:djdll/Yolov8_Distillation: Yolov8轻量化_蒸馏代码实现 在轻量化模型设计中&#xff0c;**知识蒸馏&#xff08;Knowledge Distillation&#xff09;**被广泛应用&#xff0c;作为提升模型…...

【VLNs篇】07:NavRL—在动态环境中学习安全飞行

项目内容论文标题NavRL: 在动态环境中学习安全飞行 (NavRL: Learning Safe Flight in Dynamic Environments)核心问题解决无人机在包含静态和动态障碍物的复杂环境中进行安全、高效自主导航的挑战&#xff0c;克服传统方法和现有强化学习方法的局限性。核心算法基于近端策略优化…...

脑机新手指南(七):OpenBCI_GUI:从环境搭建到数据可视化(上)

一、OpenBCI_GUI 项目概述 &#xff08;一&#xff09;项目背景与目标 OpenBCI 是一个开源的脑电信号采集硬件平台&#xff0c;其配套的 OpenBCI_GUI 则是专为该硬件设计的图形化界面工具。对于研究人员、开发者和学生而言&#xff0c;首次接触 OpenBCI 设备时&#xff0c;往…...