使用es6--对象数组的多种去重方式

最新推荐文章于 2023-07-05 16:46:33 发布

原创最新推荐文章于 2023-07-05 16:46:33 发布 · 2.9k 阅读

1 ·

CC 4.0 BY-SA版权

js 专栏收录该内容

18 篇文章

订阅专栏

本文分享了前端开发中数组及JSON数组的多种高效去重方法，包括使用ES6的Set、filter、forEach和reduce等现代JavaScript特性，简化代码并提高性能。

在当今这个前端代码时代，前端需要对数据处理的逻辑需求越来越多，也越来越复杂了；所以我在项目种总结了一些对去重的几种方式提供给到大家参考！

之前我是对数组去重是这样的，当然现在也没有被淘汰，还是可以用的只是代码看着有点l

demo:

  let array = ['amy','jack','tom','jackson','mark','jack'];

1：一维数组去重

beFore:
之前都是使用 indexOf, includes,

 var newArr = []
           for (var i = 0; i < array .length; i++) {
               if (newArr.indexOf(array [i])===-1) {
                    newArr.push(array [i])
              }
console.log(newArr)

Now: 使用es6:

var newArrStr = new Set(arr); //通过set集合去重;
//得到是字符串
 var newArr =Array.from(new Set(newArrStr));//数组

如何有多个数组只需将合并在去重即可

 var mergeArr= arr1.concat(arr2);

2 .JSON数组去重;

demo

  var obj1 = [{"id": 0, "name": "王嘉尔"},{"id": 1,"name": "段宜恩"},{"id": 0, "name": "林在范2"},];

 var obj2 = [{"id": 2, "name": "林在范"},{"id": 3,"name": "朴珍荣"},{ "id": 4,"name":"崔荣宰"},{ "id": 5,"name":"崔荣宰"},{ "id": 6,"name":"金有谦"}];

合并：

 var mergeObj= obj1 .concat(obj2 );

beFore:
在之前没有使用es6是这样的：

var new_arr=[];
var json_arr=[];
for(var i=0; i<obj2.length; i++){
    console.log(new_arr.indexOf(obj2[i][attribute]));
    if(new_arr.indexOf(obj2[i]['id']) ==-1){ 
        new_arr.push(obj2[i]['id']);  
        json_arr.push(obj2[i]);
    } else{
    }
}

console.log(json_arr);

你看看代码，十几行了；多L；咱们来看看 es6的强大；

Now: 使用es6:

2.1: filter&& forEach

//这种应用于添加数据业务需求


let newEs6Json =[];
obj2.forEach(item => {
    newEs6Json= obj1.filter(a  =>  a.spu != item.spu) 
 })
 console.log(newEs6Json );
 // [{"id": 0, "name": "王嘉尔"},{"id": 1,"name": "段宜恩"}]

2.2 reduce

 // let  obj3= obj1 .concat(obj2 );
 let new_obj ={};
 let peon =obj3.reduce((cur,next) => {
     obj[next.spu] ? "" : obj[next.spu] = true && cur.push(next);
      return cur;
 },[])

 console.log(peon);
 //[{"id": 0, "name": "王嘉尔"},{"id": 1,"name": "段宜恩"},{"id": 2, "name": "林在范"},{"id": 3,"name": "朴珍荣"},{ "id": 4,"name":"崔荣宰"},{ "id": 5,"name":"崔荣宰"},{ "id": 6,"name":"金有谦"}];

去重还是有很多种其他的方式的；我只能总结这么几个供大家参考了哈；