美文网首页
分享两种js中数组去重的方法

分享两种js中数组去重的方法

作者: 超人鸭 | 来源:发表于2019-09-26 11:17 被阅读0次

对于数组项为基本类型(基本为数字或字符串)的:

  • 使用filter数组去重
var arr = [1, 2, 2, 3, 4, 5, 5, 6, 6, 6, 7]
function fn(arr) {
  return arr.filter((x, index, self) => self.indexOf(x) === index)
}

比较简单粗暴,利用indexOf只会找到第一个匹配项的下标这个特性,忽略重复的数组项。

  • 利用对象的key去重
var arr = [1, 2, 2, 3, 4, 5, 5, 6, 6, 6, 7]
function fn(arr) {
  let hashTable = {}
  let data = []
  for (let i = 0; i < arr.length; i++) {
    if (!hashTable[arr[i]]) {
      hashTable[arr[i]] = true
      data.push(arr[i])
    }
  }
  return data
}

利用了对象的key值去重,当然,对于这种数组项为基本类型的数组,去重还有很多方法,es6出了Set这种数据类型,对普通数组的去重更是简单粗暴。

但在工作中,去重的需求并不是那么简单,往往数组是一个对象数组,然后根据其中的某一个字段去重,对于这种需求,我们还是可以用上面的方法,利用对象的key值去重:

let arr1 = [{id: 1}, {id: 2}, {id: 3}, {id: 4}]
let arr2 = [{id: 5}, {id: 2}, {id: 3}, {id: 8}]
// 比如这个,两个数组合并然后根据id这个字段去重
function fn(arr1,arr2){
  let arr = arr1.concat(arr2)
  let hashTable = {}
  let data = []
  for (let i = 0; i < arr.length; i++) {
    if (!hashTable[arr[i].id]) {
      hashTable[arr[i].id] = true
      data.push(arr[i])
    }
  }
  return data
}

觉得这个利用key值的方式还是挺万能的,之后看到还有好的方式超人鸭也会继续添加在这篇文章里面。

相关文章

  • 分享两种js中数组去重的方法

    对于数组项为基本类型(基本为数字或字符串)的: 使用filter数组去重 比较简单粗暴,利用indexOf只会找到...

  • js中数组对象去重的方法

    采用数组中的reduce方法,遍历数组,也是通过对象访问属性的方法 参考js中数组对象去重的方法

  • js中数组去重的方法

    在实际工作或面试中,我们经常会遇到“数组去重”问题,接下来就是使用js实现的数组去重的多种方法: 1.将数组的每一...

  • 数组的去重和数组中对象的去重

    数组中对象去重 方式1 jq方式 方式2 原生js方式 普通数组的去重 方式1 普通的数组去重js 方式2 Se...

  • js中两种数组对象去重的方法

    数组去重,大家可能都经常遇到过,但是数组对象去重,也不少遇到 数组对象 第一种方法 执行结果如下 第二种方法 利用...

  • js 对象数组排序+去重问题

    解决方法: 数组去重有效的方法: js如何去除一个数组中与另一个数组中的值相同的元素

  • web前端面试题-javascript(三)-编程算法题(1)

    答案只做参考,如有更好的方法欢迎留言! 1、 实现数组去重方法?(js算法) 利用对象的键值对方法:把数组中的每一...

  • 前端开发备忘录

    js 数组去重的方法 最常用的方式 对象键值法去重 es6 Set方法一键去重 js常见的循环与遍历以及不同循...

  • js 数组去重方法

    1、借助ES6[https://so.csdn.net/so/search?q=ES6&spm=1001.2101...

  • js数组中对象去重的方法

    简单说一下数组中对象去重的方法 假设当前有这样一个数组 1.对象访问属性的方法 采用对象访问属性的方法,判断属性值...

网友评论

      本文标题:分享两种js中数组去重的方法

      本文链接:https://www.haomeiwen.com/subject/sbsiuctx.html