JS对象数组去重的3种方法示例及对比

2022-04-15 0 441
目录
  • 一.去重前后数据对比
  • 二.使用方法
    • 1.使用filter和Map
    • 2.使用reduce
    • 3.使用for循环
  • 三.2400条数据,三种方法处理时间对比
    • 总结

      一.去重前后数据对比

      // 原数据是这样的                   // 去重后数据是这样的
      [{                                [{
        "goodsId": "1",                    "goodsId": "1",
        "quota": 12,                       "quota": 12,
        "skuId": "1"                       "skuId": "1"
      },                                 },
      {                                  {
        "goodsId": "2",                    "goodsId": "2",
        "quota": 12,                       "quota": 12,
        "skuId": "2"                       "skuId": "2"
      },                                 }]
      {
        "goodsId": "1",
        "quota": 12,
        "skuId": "1"
      }]
      

      二.使用方法

      1. 使用filter和Map  
      2. 使用reduce       
      3. for循环          

      结论:filter和Reduce时间上差别不是太大,filter稍微更快一些,但是filter语法更简洁

      1.使用filter和Map

      代码简洁,好用,4行代码搞定,平均耗费时间最短,五星推荐

      function uniqueFunc(arr, uniId){
        const res = new Map();
        return arr.filter((item) => !res.has(item[uniId]) && res.set(item[uniId], 1));
      }
      

      2.使用reduce

      代码稍多,平均耗费时间和第一不分伯仲,四星推荐

      function uniqueFunc2(arr, uniId){
        let hash = {}
        return arr.reduce((accum,item) => {
          hash[item[uniId]] ? '' : hash[item[uniId]] = true && accum.push(item)
          return accum
        },[])
      }
      

      3.使用for循环

      耗费时间较一二稍多,但是耗费时间平均,三星推荐

      function uniqueFunc3(arr, uniId){
        let obj = {}
        let tempArr = []
        for(var i = 0; i<arr.length; i++){
          if(!obj[arr[i][uniId]]){
            tempArr.push(arr[i])
            obj[arr[i][uniId]] = true
          }
        }
        return tempArr
      }
      

      三.2400条数据,三种方法处理时间对比

      测试次数 filter Map reduce for循环
      1 0.139892578125 ms 0.19189453125 ms 0.2060546875 ms
      2 0.12109375 ms 0.1279296875 ms 0.195068359375 ms
      3 0.112060546875ms 0.11767578125 ms 0.174072265625 ms
      4 0.10400390625 ms 0.1728515625 ms 0.18701171875 ms
      5 0.10986328125 ms 0.12890625 ms 0.175048828125 ms
      6 0.113037109375 ms 0.10791015625 ms 0.172119140625 ms
      7 0.134033203125 ms 0.129150390625 ms 0.172119140625 ms

      测试时间截图展示

      JS对象数组去重的3种方法示例及对比

      JS对象数组去重的3种方法示例及对比

      JS对象数组去重的3种方法示例及对比

      JS对象数组去重的3种方法示例及对比

      JS对象数组去重的3种方法示例及对比

      JS对象数组去重的3种方法示例及对比

      总结

      到此这篇关于JS对象数组去重的3种方法及对比的文章就介绍到这了,更多相关JS对象数组去重内容请搜索NICE源码以前的文章或继续浏览下面的相关文章希望大家以后多多支持NICE源码!

      免责声明:
      1、本网站所有发布的源码、软件和资料均为收集各大资源网站整理而来;仅限用于学习和研究目的,您必须在下载后的24个小时之内,从您的电脑中彻底删除上述内容。 不得使用于非法商业用途,不得违反国家法律。否则后果自负!

      2、本站信息来自网络,版权争议与本站无关。一切关于该资源商业行为与www.niceym.com无关。
      如果您喜欢该程序,请支持正版源码、软件,购买注册,得到更好的正版服务。
      如有侵犯你版权的,请邮件与我们联系处理(邮箱:skknet@qq.com),本站将立即改正。

      NICE源码网 JavaScript JS对象数组去重的3种方法示例及对比 https://www.niceym.com/29949.html