简单的数组去重是比较简单的,方法也特别多,如给下面的数组去重:

  1. let arr = [1,2,2,4,9,6,7,5,2,3,5,6,5]

最常用的可以用for循环套for循环,再用splice删除重复的数组:

  1. let arrUnique = function (arr){
  2. for(let i=0; i<arr.length; i++){
  3. for(let j=i+1; j<arr.length; j++){
  4. if(arr[i]==arr[j]){ //第一个等同于第二个,splice方法删除第二个
  5. arr.splice(j,1);
  6. j--;
  7. }
  8. }
  9. }
  10. return arr;
  11. }

然而数组的子集为对象时,一般不使用多个for循环来去重,如下面的数组对象:

  1. let arr = [
  2. {
  3. mch_id:'ghx1',
  4. status: 1,
  5. type: 2
  6. },
  7. {
  8. mch_id:'awx2',
  9. status: 2,
  10. type: 3
  11. },
  12. {
  13. mch_id:'ghx1',
  14. status: 1,
  15. type: 2
  16. },
  17. {
  18. status: 1,
  19. type: 2,
  20. mch_id:'ghx1'
  21. }
  22. ]

通过观察,我们可以发现该数组中的第1、3、4项其实是一样的,最初在谷歌找了几个方法最终都不太满意,比如会改变数组中对象原来的排序、数组去重失败等,后来经过多次尝试和实践,得出以下最简单的方法:

  1. 利用对象的键名无法重复的特点,我们可以新建一个临时对象来存储原数组中的对象子集的值,比如我的项目中mch_id是唯一的ID,然后设置的它为临时对象的键名,值为true即可,保证它的唯一性
  2. 通过判断对象的键名是唯一时,把对应的数组值添加到一个空数组中,最终得到一个去重后的数组对象
  3. 此方法不会改变数组对象原有的排序
  1. let arrUnique = function(arr){
  2. let result = {};
  3. let finalResult=[];
  4. for(let i=0;i<arr.length;i++){
  5. //利用对象的键名无法重复的特点,cpmch_id是唯一区别的属性值
  6. result[arr[i].mch_id] ? '' : result[arr[i].mch_id] = true && finalResult.push(arr[i]);
  7. }
  8. return finalResult;
  9. }

或者利用ES5数组方法reduce

  1. let arrUnique = function(arr){
  2. let ojb = {};
  3. arr = arr.reduce(function(prevArr, currentItem) {
  4. //利用对象的键名无法重复的特点,mch_id是唯一区别的属性值
  5. ojb[currentItem.mch_id] ? '' : ojb[currentItem.mch_id] = true && prevArr.push(currentItem);
  6. return prevArr
  7. }, [])
  8. return arr;
  9. }

提前祝大家劳动节快乐

【原】js数组对象去重最简单的方法的更多相关文章

  1. js数组对象去重

    转: https://www.cnblogs.com/gaoht/p/9850449.html 在数组对象中去掉重复的对象: export function deteleObject(obj) { v ...

  2. js 数组对象去重

    let hash = {}; let config = [ { name: 2, state: true, output: 'Y'}, { name: 3, state: true, output: ...

  3. js技巧-使用reduce实现更简洁的数组对象去重和数组扁平化

    Array.prototype.reduce()方法介绍: 感性认识reduce累加器: const arr = [1, 2, 3, 4]; const reducer = (accumulator, ...

  4. 数组去重----es6&es5&数组对象去重

    es6方法: 普通数组: 1.使用Array.from(new Set(arr)); /* * @param oldArr 带有重复项的旧数组 * @param newArr 去除重复项之后的新数组 ...

  5. 判断js数组/对象是否为空

    /** * 判断js数组/对象是否为空 * isPrototypeOf() 验证一个对象是否存在于另一个对象的原型链上.即判断 Object 是否存在于 $obj 的原型链上.js中一切皆对象,也就是 ...

  6. JS中数组对象去重

    JS数组去重 JS中对数组去重最好不要用unique方法,该方法主要是对dom节点数组的去重,如果对普通的数组元素去重只会去掉与之相邻的重复元素,也就是如果数组中还有不相邻的重复元素存在,将不会被去掉 ...

  7. JAvaScript:JS数组元素去重的方法

    在做javascript开发的时候,经常会遇到数组元素重复的问题,而javascript Array又没有直接提供方法解决此问题,还需要自己去实现. 方案一: 思路: 1.构建一个新的数组存放结果: ...

  8. JS 数组对象

    定义数组: 数组对象用来在单独的变量名中存储一系列的值. 创建一个数组有三种方法. 1: 常规方式: var myCars=new Array(); myCars[0]="Saab" ...

  9. js 数组对象的操作方法

    在jquery中处理JSON数组的情况中遍历用到的比较多,但是用添加移除这些好像不是太多. 今天试过json[i].remove(),json.remove(i)之后都不行,看网页的DOM对象中好像J ...

随机推荐

  1. Java 锁机制 synchronized

    转载请标明出处:http://blog.csdn.net/zhaoyanjun6/article/details/75126630 本文出自[赵彦军的博客] 1.前言 在多线程并发编程中Synchro ...

  2. Oracle基础快速入门

    数据库体系结构 物理存储结构与Oracle启动时关系是 依次打开 参数(startup nomount).控制(startup mount).数据文件(open) 物理存储结构:指实际的文件存储形式 ...

  3. swagger在nginx下出现无法请求接口的问题

    在Nginx配置绑定域名的时候,增加proxy_set_header即可 示例如下: server { listen ; server_name xxx.dev.internal.XXX.com; l ...

  4. angular2 安装 打包成发布项目过程

    安装之前要有typings和typescript全局已经安装好 安装命令新版为npm install -g @angular/cli 原来的angular-cli为老版的,我安装失败了 安装之后新建一 ...

  5. Linux(Redhat)安装Redis

    Redis是一个开源的使用ANSI C语言编写.支持网络.可基于内存亦可持久化的日志型.Key-Value数据库,并提供多种语言的API.(百度百科 0.0) 下载:http://www.redis. ...

  6. mysql数据库的安装步骤

    Redhat6.5 1.准备工作 卸载使用rpm包安装的mysql-server.mysql软件包 安装自带的ncurses-devel包 rpm -ivh /mnt/Packages/ncurses ...

  7. ubuntu 命令整合1

    一.linux命令基本格式 命令名[选项] [参数] 注意: 命令名区分字母大小写 命令名必须有 选项.参数可以没有,选项一般使用减号开头二.具体Linux命令 1.who 显示登录系统中的用户的信息 ...

  8. Java开源生鲜电商平台-购物车模块的设计与架构(源码可下载)

    ava开源生鲜电商平台-购物车模块的设计与架构(源码可下载) 说明:任何一个电商无论是B2C还是B2B都有一个购物车模块,其中最重要的原因就是客户需要的东西放在一起,形成一个购物清单,确认是否有问题, ...

  9. angular5学习笔记(deep in 路由)

    最近接手了一个angular5的项目.项目本身是由不同的人开发的,所有代码结构风格本身就有很大不同,加上本身接触angular5也不久,之前都是使用1,所有自身压力还是很大的. 接手前几天当然是熟悉代 ...

  10. 言简意赅的TIME_WAIT

    为什么要有TIME_WAIT? 主动关闭端发送完ACK后等2MSL(最长分节生命期),防止对端没有收到ACK这种情况,重发. 官方点,再官方点...... (1) 可靠地实现TCP全双工连接的终止: ...