js中数组对象去重的几种方式

news2024/9/28 23:27:12

js中数组对象去重的几种方式

  • 1、方法一:双层for循环
  • 2、对象访问属性的方法
  • 3、Map()方法
  • 4、reduce方法

首先我们定义数组的形式

let arrObj = [
    { name: "张三", key: '1' },
    { name: "李四", key: '2' },
    { name: "王五", key: '3' },
    { name: "张三", key: '1' },
    { name: "李四", key: '2' }
];

需求:把key值相同的对象删掉,下面是想要的结果
在这里插入图片描述

1、方法一:双层for循环

两两比较,如果后一个对象的key值和前一个对象的key值相等,就把后面的对象删除。

let arrObj = [
  { name: "张三", key: '1' },
  { name: "李四", key: '2' },
  { name: "王五", key: '3' },
  { name: "张三", key: '1' },
  { name: "李四", key: '2' }
]
function uniqueArr (arr) {
  for (let i = 0; i < arr.length; i++) {
    for (let j = i + 1; j < arr.length; j++) {
      if (arr[i].key == arr[j].key) {
        arr.splice(j, 1)
        j--
      }
    }

  }
  return arr
}
console.log(uniqueArr(arrObj));

2、对象访问属性的方法

采用对象访问属性的方法,判断属性值是否存在。

let arrObj = [
  { name: "张三", key: '1' },
  { name: "李四", key: '2' },
  { name: "王五", key: '3' },
  { name: "张三", key: '1' },
  { name: "李四", key: '2' }
]
function uniqueArr (arr) {
  var result = []
  var obj = {}
  for (var i = 0; i < arr.length; i++) {
    if (!obj[arr[i].key]) {
      result.push(arr[i])
      obj[arr[i].key] = true
    }
  }

  return result
}
console.log(uniqueArr(arrObj));

3、Map()方法

has方法可以判断Map对象中是否存在指定元素,有则返回true,否则返回false

set方法可以向Map对象添加新元素 map.set(key, value)

values方法可以返回Map对象值的遍历器对象

let arrObj = [
  { name: "张三", key: '1' },
  { name: "李四", key: '2' },
  { name: "王五", key: '3' },
  { name: "张三", key: '1' },
  { name: "李四", key: '2' }
]
// 方法一:
let map = new Map()
for (let item of arrObj) {
  if (!map.has(item.key)) {
    map.set(item.key, item)
  };
};
arr = [...map.values()]
console.log(arr)



// 方法二: (代码较为简洁)
const map = new Map()
const newArr = arrObj.filter(v => !map.has(v.key) && map.set(v.key, 1))
console.log(newArr);

4、reduce方法

let arrObj = [
  { name: "张三", key: '1' },
  { name: "李四", key: '2' },
  { name: "王五", key: '3' },
  { name: "张三", key: '1' },
  { name: "李四", key: '2' }
]
var obj = {}
arrObj = arrObj.reduce(function (item, next) {
  obj[next.key] ? '' : obj[next.key] = true && item.push(next)
  return item
}, [])
console.log(arrObj);

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/670813.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

基于langchain+chatGLM搭建部署本地私有化知识库系统

前言 一、 自主GPT 所谓自主&#xff08;autonomous&#xff09;GPT是设计一个Agent&#xff0c;让它自己做计划、决策和动作&#xff0c;通过源源不断的迭代&#xff0c;去完成设定的目标。比如 AutoGPT 。 AutoGPT把GPT的能力推向了更高的应用层次。设定一个任务&#xff…

mac下qtcreator代码格式化

代码开发&#xff1a;qtcreator qtcreator 插件&#xff1a;Beautifier 格式化工具&#xff1a;clang-format 1、Beautifier插件安装 将复现框勾选后重启qtcreator即可。 2、安装clang-format工具 &#xff08;1&#xff09;打开终端输入下面命令等待安装完成 brew install…

Python基础(19)——Python函数讲解一

Python基础&#xff08;19&#xff09;——Python函数讲解一 文章目录 Python基础&#xff08;19&#xff09;——Python函数讲解一目标一. 函数的作用二. 函数的使用步骤2.1 定义函数2.2 调用函数2.3 快速体验 三.函数的参数作用四.函数的返回值作用4.1 应用 五.函数的说明文档…

大快人心,华为EDA领域的新突破,关联软件已取得全面适配

EDA被称为“芯片之母”&#xff0c;是集成电路、电子信息&#xff0c;甚至是全球数字经济的赋能者&#xff0c;是许多电子产业链的基石。 一直以来&#xff0c;就被国际的三大巨头占领&#xff1a;美国Synopsys、美国Cadence、德国Mentor Graphics&#xff0c;市场份额高达90%。…

locust学习教程(6)- 使用更快的http客户端:FastHttpUser

目录 1、概念 2、估算电脑允许的最大并发数 3、fasthttpuser的使用 &#x1f381;更多干货 完整版文档下载方式&#xff1a; 1、概念 Locust 的默认 HTTP 客户端使用的是 python-requests 库。如果我们需要运行非常高的吞吐量测试&#xff0c;去判断吞吐量是否达到预期值&…

免费文字转语音软件哪个好?推荐这三款文字转语音软件给你

文字转语音软件可以将我们输入的文字内容转化为人声朗读出来&#xff0c;这在很多场合都非常实用。比如&#xff0c;在开车或者做家务时&#xff0c;无法手持手机进行阅读&#xff0c;但是通过文字转语音功能&#xff0c;就可以轻松地听取所需内容。然而&#xff0c;市面上的文…

贴吧私信辅助软件工具开发

贴吧私信辅助软件工具开发&#xff0c;贴吧无线私信&#xff0c;用好贴吧也是一个大流量途径 【引流必备】最新外面卖1000多一套的贴吧私信机&#xff0c;日发私信十万条【详细视频操作教程软件】 服务时间&#xff1a;&#xff08;8&#xff1a;00—23&#xff1a;00&#xf…

MySQL数据库——事务

MySQL数据库——事务 一、事务的概念二、事务的ACID特点1.原子性2.一致性3.隔离性4.持久性5.事务隔离级别的作用范围 三、事务级别的查看与设置1.查询全局事务隔离级别2.查询会话事务隔离级别3.设置全局事务隔离级别4.设置会话事务隔离级别 四、事务控制语句1.测试提交事务2.测…

ssm 疫情防控数据可视化平台-计算机毕设 附源码87063

ssm 疫情防控数据可视化平台 摘要 信息化社会内需要与之针对性的信息获取途径&#xff0c;但是途径的扩展基本上为人们所努力的方向&#xff0c;由于站在的角度存在偏差&#xff0c;人们经常能够获得不同类型信息&#xff0c;这也是技术最为难以攻克的课题。针对疫情防控数据可…

图像直方图笔记

图像直方图 在统计学中&#xff0c;直方图是一种对数据分布情况的图形化表示方法。 图像直方图是用来表示数字图像中亮度分布的直方图&#xff0c;使用图像直方图可以很直观地观察到该图的亮度分布情况。在图像直方图中&#xff0c;横轴从左到右分别表示了从纯黑到纯白区域的亮…

【C语言初阶】函数的具体用法,有这篇博客就够了

君兮_的个人主页 勤时当勉励 岁月不待人 C/C 游戏开发 Hello&#xff0c;这里是君兮_&#xff0c;今天又又又来给大家更新0基础C语言中的内容啦&#xff01;今天给大家带来的是C语言当中函数的调用以及使用&#xff0c;废话不多说我们直接开始吧&#xff01; 函数详解 一.函数…

专治疑难系列 - 解决打印机凭证冲突问题

‍‍&#x1f3e1;博客主页&#xff1a; Passerby_Wang的博客_CSDN博客-系统运维,云计算,Linux基础领域博主 &#x1f310;所属专栏&#xff1a;『专治疑难系列』 &#x1f30c;上期文章&#xff1a; 专治疑难系列 - 解决Ubuntu忘记root密码问题 &#x1f4f0;如觉得博主文章…

深度学习实例分割篇——Mask RCNN原理详解篇

&#x1f34a;作者简介&#xff1a;秃头小苏&#xff0c;致力于用最通俗的语言描述问题 &#x1f34a;专栏推荐&#xff1a;深度学习网络原理与实战 &#x1f34a;近期目标&#xff1a;写好专栏的每一篇文章 &#x1f34a;支持小苏&#xff1a;点赞&#x1f44d;&#x1f3fc;、…

如何系列 如何使用SikuliX执行自动化任务

文章目录 什么是SikuliX&#xff1f;SikuliX的使用场景安装SikuliX常用方法查找鼠标键盘其他 示例脚本示例一 自动抢票示例二 自动打开计算器示例三 自动访问CSDN博客搜索博主并关注其他 SikuliX原理SikuliX脚本Sikuli 源文件夹或压缩文件&#xff08;.sikuli、.skl&#xff09…

电源纹波测试,居然还能这么玩

开关稳压器因其具有非常高的效率优势&#xff0c;正在各个领域逐渐替代线性稳压器。 但由于开关稳压器通常被认为具有很大的输出纹波(Ripple)&#xff0c;所以很多工程师在高性能和噪声敏感型系统中只考虑使用低压差(LDO)稳压器。 而事实上&#xff0c;现今很多高性能开关稳压…

人机接口回路原理(三)

四、串行通信接口电路 &#xff08;一&#xff09;人机接口与保护CPU之间的串行通信 1&#xff0e;串行通信接口电路及其作用 人机接口与保护CPU之间的串行通信的作用是人机对话和巡检&#xff0c;其电路见图1&#xff0d;33所示。这个串行通信系统是主从分布式的系统&#x…

双向可控硅控制后续篇:过零检测电路、丢波、斩波、定时

概念讲解 当我们在使用AC负载的时候&#xff0c;为了能较好的控制负载工作功率&#xff0c;需要用到继电器、可控硅等对负载进行工作与断开的控制&#xff0c;从而将功率维持在所需的大小上&#xff0c;之前介绍双向可控硅的文章也讲了其控制方式主要有&#xff1a;定时、丢波…

go语言的反射和泛型

反射 反射可以在程序的运行时获取变量的各种信息。Go语言中光反射在reflect包下。 http://c.biancheng.net/view/4407.html 泛型 Go语言中通过断言转化为指定类型。 func main() {arr : []string{"int", "dghjs", "hdk"}printArr(arr)arr1 …

【JavaWeb】servlet实现excel表格数据批量导入到数据库

这是一个教大家使用excel表格&#xff0c;批量将数据导入到数据库的一个教程 通过Javaweb项目 的servlet技术实现&#xff0c;教程详细简单&#xff0c;跟着做就不会报错&#xff01; 1.下载依赖包&#xff1a; tomcat-jdbc的jar包下载&#xff1a;文件上传批量导入数据库依赖…

一篇打通,性能测试与性能测试瓶颈评估,测试之道...

目录&#xff1a;导读 前言一、Python编程入门到精通二、接口自动化项目实战三、Web自动化项目实战四、App自动化项目实战五、一线大厂简历六、测试开发DevOps体系七、常用自动化测试工具八、JMeter性能测试九、总结&#xff08;尾部小惊喜&#xff09; 前言 什么是性能测试&a…