数组对象去重的几种方法

news2024/11/27 2:44:19

场景:

let arrObj = [
    { name: "小红", id: 1 },
    { name: "小橙", id: 1 },
    { name: "小黄", id: 4 },
    { name: "小绿", id: 3 },
    { name: "小青", id: 1 },
    { name: "小蓝", id: 4 }
];


方法一:双层for循环

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

let arrObj = [
    { name: "小红", id: 1 },
    { name: "小橙", id: 1 },
    { name: "小黄", id: 4 },
    { name: "小绿", id: 3 },
    { name: "小青", id: 1 },
    { name: "小蓝", id: 4 }
];
function fn1(tempArr) {
    for (let i = 0; i < tempArr.length; i++) {
        for (let j = i + 1; j < tempArr.length; j++) {
            if (tempArr[i].id == tempArr[j].id) {
                tempArr.splice(j, 1);
                j--;
            };
        };
    };
    return tempArr;
};
console.log(fn1(arrObj));

方法二:indexOf()

定义一个数组存储id的值,然后逐个比较,把id值重复的对象删除即可

let arrObj = [
    { name: "小红", id: 1 },
    { name: "小橙", id: 1 },
    { name: "小黄", id: 4 },
    { name: "小绿", id: 3 },
    { name: "小青", id: 1 },
    { name: "小蓝", id: 4 }
];
function fn2(tempArr) {
    let newArr = [];
    for (let i = 0; i < tempArr.length; i++) {
        if (newArr.indexOf(tempArr[i].id) == -1) {
            newArr.push(tempArr[i].id);
        } else {
            tempArr.splice(i, 1);
            i--;
        };
    };
    return tempArr;
};
console.log(fn2(arrObj));

方法三:对象访问属性的方法

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

let arrObj = [
    { name: "小红", id: 1 },
    { name: "小橙", id: 1 },
    { name: "小黄", id: 4 },
    { name: "小绿", id: 3 },
    { name: "小青", id: 1 },
    { name: "小蓝", id: 4 }
];
function fn3(tempArr) {
    let result = [];
    let obj = {};
    for (let i = 0; i < tempArr.length; i++) {
        if (!obj[tempArr[i].id]) {
            result.push(tempArr[i]);
            obj[tempArr[i].id] = true;
        };
    };
    return result;
};
console.log(fn3(arrObj));

方法四:Map()

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

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

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

let arrObj = [
    { name: "小红", id: 1 },
    { name: "小橙", id: 1 },
    { name: "小黄", id: 4 },
    { name: "小绿", id: 3 },
    { name: "小青", id: 1 },
    { name: "小蓝", id: 4 }
];
// 方法一:
let map = new Map();
for (let item of arrObj) {
    if (!map.has(item.id)) {
        map.set(item.id, item);
    };
};
arr = [...map.values()];
console.log(arr);
 
 
 
// 方法二: (代码较为简洁)
const map = new Map();
const newArr = arrObj.filter(v => !map.has(v.id) && map.set(v.id, 1));
console.log(newArr);

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

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

相关文章

Leetcode.1289 下降路径最小和 II

题目链接 Leetcode.1289 下降路径最小和 II rating : 1697 题目描述 给你一个 n x n 整数矩阵 g r i d grid grid &#xff0c;请你返回 非零偏移下降路径 数字和的最小值。 非零偏移下降路径 定义为&#xff1a;从 g r i d grid grid 数组中的每一行选择一个数字&#xff…

matplotlib/seaborn 笔记:mpld3 让图像可交互

只需要一行代码 mpld3.display()/mpld3.enable_notebook() 即可让 matplotlib/sdeaborn画的图有交互性 import numpy as np import matplotlib.pyplot as plt import mpld3xnp.random.random(1000) ynp.random.random(1000)plt.hist2d(x,y,bins(100,100)) mpld3.enable_noteboo…

国产芯力特SIT1024QHG四通道本地互联网络(LIN)收发器,可替代TJA1024HG

SIT1024Q 是一款四通道本地互联网络&#xff08;LIN&#xff09;物理层收发器&#xff0c;符合 LIN 2.0、LIN 2.1、LIN 2.2、 LIN 2.2A 、 ISO 17987-4:2016 (12V) 和 SAE J2602 标准。主要适用于使用 1kbps 至 20kbps 传输速 率的车载网络。 SIT1024Q 通过 TXDx 引…

聊聊低代码的本质,是应用开发的未来吗?

聊聊低代码的本质&#xff0c;是应用开发的未来吗&#xff1f; 一、前言 二、什么是低代码以及功能特点&#xff1f; 什么是低代码开发&#xff1f; 低代码平台的特点和功能 三、低代码的本质是什么&#xff1f; 四、优秀且低调的低代码平台 五、结论 一、前言 低代码开发是近年…

当管理多个项目面临这些挑战时,怎样才能不翻车?

企业越发展&#xff0c;同时进行的项目就越多。管理工作量、跟踪截止日期以及了解优先顺序也变得更复杂了。在此过程中&#xff0c;多项目管理通常面临4个常见挑战。 1. 优先事项不明确或相互冲突 无论你的项目计划多么严谨&#xff0c;事情也不可能总是按照预期进行。在管理单…

3年测试经验,用例设计竟然不知道状态迁移法?

1、概念 状态迁移法主要关注在测试状态转移的正确性上面。对于一个有限状态机&#xff0c;通过测试验证其在给定的条件内是否能够产生需要的状态变化&#xff0c;有没有不可达的状态和非法的状态&#xff0c;是否可能产生非法的状态转移等。通过构造能导致状态迁移的事件&…

动力节点Redis7实战教程,从基础到底层一套通关

Redis是一种非常强大的数据缓存和存储系统&#xff0c;既可以用作关系型数据库的缓存降低查询延迟&#xff0c;也可以作为一个分布式系统的共享数据存储。 动力节点的Redis7课程将带领大家完整的学习Redis7.0版本&#xff0c;内容涵盖Redis全套知识体系&#xff0c;由浅入深 总…

如何把视频转换成gif图片?gif图片在线制作教程

是不是许多朋友认为将视频转换为gif动画需要使用非常复杂的工具&#xff0c;事实上只需要使用gif图片在线制作工具&#xff0c;就可以轻松把视频转gif&#xff0c;下面是视频在线转gif&#xff08;https://www.gif.cn&#xff09;的详细操作步骤。 打开首页&#xff0c;点击【…

shopify独立站运营操作步骤?如何经营管理?

如何进行shopify独立站运营流程?shopify的自主网站管理过程? 在如今数字化的商业世界中&#xff0c;建立和管理自己的在线商店变得越来越重要。shopify独立站运营成为了许多创业者的首选。本文将为您介绍一些关键的操作步骤&#xff0c;帮助您顺利开展shopify独立站运营&…

SOLIDWORKS工程图修订表关联PDM

日常工作中图纸设计变更需要修订表去记录变更的内容信息&#xff0c;修订表格可以列出各种信息&#xff0c;例如审批人员或已更改图纸上的位置。所有修订表都将包含更改的详细信息或描述以及更改发布日期。 SOLIDWORKS PDM 2018 版及以上版本可由SOLIDWORKS PDM 中的工作流驱动…

lc15.三数之和

暴力解法&#xff1a;三层for循环&#xff0c;每个循环指向一个变量&#xff0c;求所有的和为零的情况 时间复杂度&#xff1a;O(n3) 空间复杂度&#xff1a;O(1) 双指针 1、对数组进行排序 2、外层循环控制第一个数 i&#xff1b;第一个数的范围必须保证小于等于0&#xf…

嘉楠勘智k230开发板上手记录(五)--nncase部署yolov5s

虽然没有找到hhb的官方示例&#xff0c;但是我找到了nncase的&#xff0c;在src/big/nncase/examples中 一、环境搭建 examples也有个readme&#xff0c;不过里面的环境搭建跟sdk中的有点差别&#xff0c;不过大差不差&#xff0c;docker容器已经启动了&#xff0c;需要在容器…

python 书籍

python高手进阶之路 10册 QQ:417398600

通过SunFlower学习Hilt基本使用

文章目录 添加hilt配置数据库自动注入常规kotlin 规范创建AppDatabase、表、查询封装Dao创建DatabaseModule&#xff0c;向外提供数据库访问方法InstallIn和Provider上Scope关系PlantRepository 使用 PlantDaoViewModel使用PlantRepositoryFragment声明需要进行注入sunflower 仓…

藏语翻译器:多功能翻译软件

这是是一款能够将藏语翻译成其他语言或将其他语言翻译成藏语的软件。该软件能够识别并翻译藏语中的常用词汇和短语&#xff0c;并且支持多种常见语言的翻译&#xff0c;例如英语、汉语、法语、德语等等。此外&#xff0c;藏语翻译器还具有简单易用的用户界面&#xff0c;方便用…

ASEMI快恢复二极管APT60DQ20BG参数规格

编辑-Z APT60DQ20BG参数描述&#xff1a; 型号&#xff1a;APT60DQ20BG 最大峰值反向电压(VRRM)&#xff1a;200V 最大直流阻断电压VR(DC)&#xff1a;200V 平均整流正向电流(IF)&#xff1a;60A 非重复峰值浪涌电流(IFSM)&#xff1a;300A 工作接点温度和储存温度(TJ, …

Spring5学习笔记— 工厂高级特性

✅作者简介&#xff1a;大家好&#xff0c;我是Leo&#xff0c;热爱Java后端开发者&#xff0c;一个想要与大家共同进步的男人&#x1f609;&#x1f609; &#x1f34e;个人主页&#xff1a;Leo的博客 &#x1f49e;当前专栏&#xff1a; Spring专栏 ✨特色专栏&#xff1a; M…

RestTemplate 请求转发异常 ERR_CONTENT_DECODING_FAILED 200 (OK)

#1 问题描述 在基于Spring Boot的项目中实现了请求转发&#xff08;使用 RestTemplate 的 exchange 方法&#xff09;的功能&#xff0c;忽然在前端报net::ERR_CONTENT_DECODING_FAILED 200 (OK)的错误&#xff0c;后端及上游系统日志均显示请求已完成。 #2 原因探寻 上述错…

黑马机器学习day3

1.线性回归 1.1线性回归的原理 线性关系 非线性关系 1.2线性回归的损失和优化原理 目标&#xff1a;求模型参数&#xff0c;模型参数能够使预测准确 1损失函数 2优化方法 正规方程&#xff1a;直接求解W梯度下降&#xff1a;试错&#xff0c;改进 1.3线性回归API 1线性回…