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

JavaScript实现数组对象去重

时间:2023-02-09 20:12:07浏览次数:48  
标签:arr Set name 对象 JavaScript item result 数组 id

有多种实现方式:

一、使用 Set 对象:

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/lyso/p/17106852.html

相关文章

  • c语言填空:两个数组计算
    #include<stdio.h>//求出a中各相邻两个元素的和,并将这些和存放在数组b中//按每行3个元素的形式输出。例如:b[1]=a[1]+a[0],....,b[9]=a[9]+a[8]main(){inta[10......
  • 【js】数组:filter函数
    前言:在使用filter的时候,永远返回的是一个“被筛选后的”新数组  1、定义 filter() 用于过滤某些元素,如果有if判断,if中往往返回的是true或false(布尔值)2、使用fil......
  • vue中对象的添加属性并赋值
    vue中对象的添加属性并赋值如果在vue中给dataform={}中增加age属性并进行赋值使用this.dataform.age='18',会报this.dataform.ageundefined原因:受现代JavaScript......
  • 将二维数组作为函数参数
    今天本来正在写一个稀疏数组的代码,要写的内容很简单,创建一个11x11的数组,将其中两个位置分别赋值为1、2,其余位置为0。然后输出数组看一下是否赋值正确。正常是很简单的事情......
  • 一个大数组根据特定大小分割为多个小数组
    1.Using Skip() and Take()的普通方法usingSystem;usingSystem.Linq;usingSystem.Collections.Generic;publicstaticclassExtensions{publicstat......
  • 连续数组
    给定一个二进制数组 nums ,找到含有相同数量的 0 和 1 的最长连续子数组,并返回该子数组的长度。/***@param{number[]}nums*@return{number}*/constf......
  • Python一切皆对象_ type & object & class
    相比较于Java等静态语言,在Python中一切皆对象的概念更加彻底,函数和类都是对象,这样使得Python更加灵活。下面将对Python中对type、object以及class对关系进行梳理。关系图:......
  • js获取后端图片生成File对象
    leturl=GLOBAL.BACKENDURL+"/image/"+name;fetch(url,{method:"GET",mode:"cors",}).then((res)=>{returnres.blob();}).then((blob)=>{let......
  • 云对象模板
    1//云对象教程:https://uniapp.dcloud.net.cn/uniCloud/cloud-obj2//jsdoc语法提示教程:https://ask.dcloud.net.cn/docs/#//ask.dcloud.net.cn/article/1293mo......
  • 4.4 数组是高效使用内存的基础
    数组是指多个同样数据类型的数据在内存中连续排列的形式。作为数组元素的各个数据会通过连续的编号被区分开来,这个编号称为索引(index)。指定索引后,就可以对该索引所对应地......