首页 > 编程语言 >JavaScript实现数组对象去重

JavaScript实现数组对象去重

时间:2023-09-21 16:34:02浏览次数:33  
标签:arr Set name 对象 JavaScript item result 数组 id

有多种实现方式:

一、使用 Set 对象:

1 Array.from(new Set(array))

该方法会先创建一个 Set 对象,然后再使用 Array.from 方法将 Set 对象转换为数组,因为 Set 对象不允许有重复的元素,所以这样可以实现去重的效果。

但是,如果数组中的元素是对象,Set 对象会识别为不同的元素,所以不能直接使用该方法。为了解决这个问题,你可以使用一个映射函数,将数组中的对象映射为一个字符串或数字,然后再使用该方法。

以下是一个具体的例子:

复制代码
const arr = [
    { id: 1, name: 'A' },
    { id: 2, name: 'B' },
    { id: 1, name: 'A' },
    { id: 3, name: 'C' }
];

const result = Array.from(new Set(arr.map(item => JSON.stringify(item)))).map(item => JSON.parse(item));
console.log(result);
复制代码

 

二、使用`reduce`方法:

复制代码
const arr = [
    { id: 1, name: 'A' },
    { id: 2, name: 'B' },
    { id: 1, name: 'A' },
    { id: 3, name: 'C' }
];
const result = arr.reduce((pre, cur) => {
    var exists = pre.find(item => JSON.stringify(item) === JSON.stringify(cur));
    if (!exists) {
        pre.push(cur);
    }
    return pre;
}, []);
console.log(result);
复制代码

 

三、使用`filter`方法

复制代码
const arr = [
    { id: 1, name: 'A' },
    { id: 2, name: 'B' },
    { id: 1, name: 'A' },
    { id: 3, name: 'C' }
];
const result =arr.filter((item, index, self) => {
    return self.findIndex(t => JSON.stringify(t) === JSON.stringify(item)) === index;
});
console.log(result);

标签:arr,Set,name,对象,JavaScript,item,result,数组,id
From: https://www.cnblogs.com/kn-zheng/p/17720272.html

相关文章

  • MySQL数据库查询对象空值判断与Java代码示例【含面试题】
    AI绘画关于SD,MJ,GPT,SDXL百科全书面试题分享点我直达2023Python面试题2023最新面试合集链接2023大厂面试题PDF面试题PDF版本java、python面试题项目实战:AI文本OCR识别最佳实践AIGamma一键生成PPT工具直达链接玩转cloudStudio在线编码神器玩转GPUAI绘画、AI讲话、......
  • Python面向对象
    Python面向对象初识对象以表格为例:整张表格就好比一个对象,里面的信息就是对象的属性。设计表格,称之为:设计类(class)打印表格,称之为:创建对象填写表格,称之为:对象属性赋值classStudent:name=None#姓名gender=None#性别nationali......
  • python,一个数组y1存放yolo的位置信息BBOX,一个y2数组存放识别的结果信息,根据y1数组按
    importnumpyasnp#示例数据y1=np.array([[50,100,200,300],[10,20,30,40],[60,70,80,90]])y2=np.array(['cat','dog','bird'])#按左上角点的坐标排序y1数组sorted_indices=np.lexsort((y1[:,1],y1[:,0]))y1_sorted=y1[sorted......
  • LeetCode53.最大子数组和
    要求最大连续子数组的和,可以这样考虑,比如现在我想求下标 i~j,i<j 这一范围内子数组的和,那么我可以分别先求出 0~i-1 范围和 0~j 范围两个子数组的和,可得Sum[i~j]=Sum[0~j]-Sum[0~i-1] ,这就是本题解法的核心思想。解法详细描述:先从下标0开始,遍历 nums 数组,求出到当前下标......
  • vue通过 v-for循环出来的数组给元素 加不同的颜色
    直接上代码:1<divv-for="(item,i)incolorList":key="i">2<divclass="cmn-color">3<div:style="{'background':item}"></div><span>开发{{i+1}}</span>4</d......
  • Javascript闭包(Closure)
    闭包(closure)是Javascript语言的一个难点,也是它的特色,很多高级应用都要依靠闭包实现。下面就是我的学习笔记,对于Javascript初学者应该是很有用的。一、变量的作用域要理解闭包,首先必须理解Javascript特殊的变量作用域。变量的作用域无非就是两种:全局变量和局部变量。Javascript语言......
  • JS 对象(Object)和字符串(String)互转
    利用原生JSON对象,将对象转为字符串1.varjsObj={};2.jsObj.testArray=[1,2,3,4,5];3.jsObj.name='CSS3';4.jsObj.date='8May,2011';5.varstr=JSON.stringify(jsObj);6.alert(str);从JSON字符串转为对象1.varjsObj={};2.jsObj.......
  • 视频直播app源码,VBA 之Interior 对象设置底色
    视频直播app源码,VBA之Interior对象设置底色1.ColorIndex索引颜色值Sub索引颜色值()  Fori=1To56    Cells(i,1).Interior.ColorIndex=i    Cells(i,2)=i  Nexti     Fori=1To56    Cells(i,3).Interior.ColorInd......
  • 无涯教程-JavaScript - COUNTIFS函数
    描述COUNTIFS函数将多个条件应用于跨多个范围的单元格,并计算满足所有条件的次数。语法COUNTIFS(criteria_range1,criteria1,[criteria_range2,criteria2]…)争论Argument描述Required/Optionalcriteria_range1Thefirstrangeinwhichtoevaluatetheassociat......
  • 二维数组
    for(inti=0;i<array.GetLength(0);i++){for(intj=0;j<array.array.GetLength(1);j++){Console.WriteLine(array[i,j]);}//0,00,10,2//1,01,11,2}基本概念1.二维数组是使用两个下标(索引)来确定元素的数组两个下标可以理解为行标和列......