一、数组去重

let srcArray = [1, 2, 3, 4, 1, 2, 3, 4]

1.  双层循环+splice

注: splice删除了一个元素,下标要减一,否则循环会漏掉一个元素(多个相邻的元素 可能会漏掉删除元素)

for(let i=0;i<srcArray.length - 1;i++){
    for(let  j = i+1;j<srcArray.length;j++){
        if(srcArray[i]  === srcArray[j] ){
            srcArray.splice(j,1);
            j--;
        }
    }
}   // srcArray=[1, 2, 3, 4]

2. forEach+indexOf (利用对象属性key排除重复项)

注:遍历数组,每次判断新数组中是否存在该属性,不存在就存储在新数组中

srcArray.forEach((key,index)=>{

if(newArr.indexOf(key) === -1){ newArr.push(key) }

}) //newArr=[1, 2, 3, 4]

这个方法的优点是效率高,缺点是使用了额外空间

3. new Set(数组)

注:Set是一系列无序、没有重复值的数据集合,传入一个需要去重的数组,Set会自动删除重复的

let tarArray = new Set(srcArray )

// tarArray = [1, 2, 3, 4]

4. filter() indexOf()

let tarArray = srcArray.filter((item, index, array) => {
  return array.indexOf(item) === index
})  // tarArray = [1, 2, 3, 4]

5. reduce() + includes

注:利用reduce()的 “累加器”原理,保存一个唯一项的运行列表。

利用reduce遍历和传入一个空数组作为去重后的新数组,然后内部判断新数组中是否存在当前遍历的元素,不存在就插入新数组

let tarArray = srcArray.reduce((unique, item) => { unique.includes(item) ? unique : [...unique, item] }, [])

// tarArray = [1, 2, 3, 4]

二、对象去重

对象不用去重的!!!对象的属性的一个特点就是元素不能相同, 甚至还可以利用这个特性来去重。

三、对象数组去重

const arr = [{"id":1,"name":"张三"},{"id":2,"name":"李四"},{"id":3,"name":"王五"},{"id":2,"name":"张三"}];

1. 双层循环

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

2. for循环+新数组

let result = [];

for ( let i = 0; i < arr.length; i++) {
      var flag = true;
      for ( let j = 0; j < result.length; j++) {
        if (arr[i].id=== result[j].id) {
          flag = false;
        }
      }
      if (flag) {
        result.push(arr[i]);
      }
    } // result = [{"id":1,"name":"张三"},{"id":2,"name":"李四"},{"id":3,"name":"王五"}]

3. 利用对象属性

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

4.reduce()

注: reduce第一个参数是遍历需要执行的函数,第二个参数是item的初始值

let obj = {};
newarr = arr.reduce(function(item, next) { 
       obj[next.id] ? '  ' : obj[next.id] = true && item.push(next);
       return item;
    }, []); // newarr = [{"id":1,"name":"张三"},{"id":2,"name":"李四"},{"id":3,"name":"王五"}]

5. Map()

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

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

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

let res = new Map();
    for (let i of arr) {
        if (!res.has(i.id)) {
            res.set(i.id, i);
        }
    }
 arr = [...res.values()];

// arr = [{"id":1,"name":"张三"},{"id":2,"name":"李四"},{"id":3,"name":"王五"}]

总结:对象数组的去重,大多是在数组去重的基础上处理的,掌握了数组的去重,对象数组的去重基本一个套路,也就好弄了。

数组去重,对象去重,数组对象去重相关推荐

  1. js 去重某个键值 数组对象_JS数组去重常见方法分析

    数组去重是开发中经常会遇到的问题,也是面试时经常会考到的.JS实现数组去重可以有多种方法: 一.简单的去重方法 用一个类比来简单解释一下这种去重方法的思路:A篮子里有若干个不同颜色和大小的球,旁边放一 ...

  2. es6通过Map对象对数组去重

    关于js数组去重的方法有很多,我以前居然用的是嵌套两层for循环来加一层if来判断数组里面的重复数据,当我了解了es的方法之后,才发现我的方法是有多蠢(笑哭). 首先关于数组去重我们先简单介绍一下es ...

  3. 【案例】js 数组对象去重,根据对象的一个属性去重、合并

    // 模拟数据 let Iclass = [{name: 'DFG', apply_phone: '131****8569'},{name: '李三', apply_phone: '150****88 ...

  4. js 去重某个键值 数组对象_js数组去重(包括对象数组去重)

    2019.08.02补: 对象数组建议直接循环然后使用工具库(lodash)的深比较,评论里也有指出,文章的方法有些取巧了 生产环境不要这么玩~. 方法一:利用ES6的Array.from()/扩展运 ...

  5. android两个数组对象去重合并,JS 数组,数组对象的合并去重方法

    此次对数组的操做,咱们使用es6的新语法来完成,因此在看下边代码以前,咱们要了解咱们下边要用到的es6中的set集合,和for...of 方法:javascript 首先介绍set集合: ES6提供了 ...

  6. 内置对象的API Array数组对象 String字符串对象 json字符串 JSON对象 js作用域及变量预解析 引用类型与值类型区别 共享引用 基本包装类型 数组去重

    01-内置对象的API a.Date对象获取时间 b.Array对象数组加工 c.String对象字符串加工 d.json字符串的语法格式 e.JSON对象的字符串与对象转换应用 02-JS作用域 a ...

  7. 数组去重,ES6数组去重 new Set()

    普通数组去重 var b = [...new Set([1,2, 3, 4, 5, 5, 5, 5])]console.log(b); 输出结果: 包含对象的数组去重 var o ={a:1}var ...

  8. JS的表单序列化,数组去重,判断数组是否重复等方法

    一.背景 本篇主要是记录一下JS中常用的工具方法.包括表单序列化,判断数组是否重复,数组去重等.做个笔记 二.工具方法 1.表单元素序列化为对象 public function serializeOb ...

  9. set和map去重调用什么方法_Es6中Map对象和Set对象的介绍及应用

    前言 今天说一说ES6的Set对象和Map对象.以及这两个对象的应用.目前主流浏览器(chrome32.IE11.Safari7.1以及 Firefox 13以上)都对这2个对象做了基本的支持.因此, ...

  10. android 字符串数组去重,GitHub - deng-ming-hao/ec-do: 实例为日常开发常用的小实例,包括数组去重,打乱数组,字母大小写转换,cookie操作的封装等。...

    ec-do 自己封装的常用操作实例 实例为日常开发常用的小实例,包括数组去重,打乱数组,字母大小写转换,cookie操作的封装等. 使用方法 引入ec-do.js //去除空格 ecDo.trim(' ...

最新文章

  1. 网络安全和支付 讲解
  2. block引用外部变量原理
  3. java RSA加密解密实现(含分段加密)
  4. c++面向对象高级编程 学习二 带指针的类
  5. docker 其他电脑访问权限_docker – 从远程计算机连接到容器
  6. Laravel 5 IDE Helper 安装
  7. windows如何在局域网下共享文件(传输文件、修改文件)
  8. 项目:心肺复苏按压仪+沁恒赤兔ch32v307+嵌入式开发
  9. RS485模块的介绍及引脚连线说明
  10. 关于飞信的协议以及验证码
  11. 教你联想一体机win7系统安装教程
  12. JAVA设计模式详解(四)----------适配器模式
  13. Class34--猜字游戏
  14. \node_modules\node-sass\build\src\libsass.vcxproj(20,3): error MSB4019: 未找到导入的项目“D:\Microsoft.Cpp.De
  15. 人脸识别中的活体检测算法
  16. CSS | width、height中auto与100%与固定值有什么不同
  17. 工业互联网企业蘑菇物联获数千万元A轮融资,元禾原点资本领投...
  18. libusb-win32 在visual studio2008中编译
  19. 云原生尝试——Docker部署node项目
  20. 【联邦学习】联邦学习

热门文章

  1. matlab画等势线,求助大牛MATLAB画三维等势面
  2. 好的决策是怎么产生的
  3. 白门柳-刘斯奋有声小说
  4. WPF:Provide value on 'System.Windows.Baml2006.TypeConverterMarkupExtension'
  5. Objective-C学习篇08—NSDictionary与NSSet
  6. 深度学习高效计算与处理器设计
  7. UI 设计的整个工作流程是怎样的?
  8. 段错误(Segmentation fault)
  9. 【Flink系列】使用logback
  10. 【STC8学习笔记】STC8A8K64S4A12串口配置