How to remove duplicates from an array object in javascript-CodePudding

I want to remove duplicates, and to left only unique items in a sub-object array.

function display_message() {
  let filteredSerivces = 
  [
    {
        "ServiceTypeId": 805,
        "ServiceTypeName": "Custom Services 1",
        "GroupedServices": [
            {
                "Id": 5247,
                "ServiceTypeId": 805,
                "ServiceName": "Some service A2",
                "Name": "A1",
                "Duration": 30,
                "DurationForClient": 30,
                "Order": 4,
                "EmployeeId": 3683
            },
            {
                "Id": 5254,
                "ServiceTypeId": 805,
                "ServiceName": "Some service A2",
                "Name": "A2",
                "Duration": 30,
                "DurationForClient": 30,
                "Order": 4,
                "EmployeeId": 3683
            },
            {
                "Id": 5254,
                "ServiceTypeId": 805,
                "ServiceName": "Some service A6",
                "Name": "A2",
                "Duration": 30,
                "DurationForClient": 30,
                "Order": 4,
                "EmployeeId": 3684
            }
        ],
        "Order": 4
    },
    {
        "ServiceTypeId": 804,
        "ServiceTypeName": "Custom Services 2",
        "GroupedServices": [
            {
                "Id": 5246,
                "ServiceTypeId": 804,
                "ServiceName": "Some service B1",
                "Name": "B1",
                "Duration": 30,
                "DurationForClient": 30,
                "Order": 5,
                "EmployeeId": 3696
            },
            {
                "Id": 5248,
                "ServiceTypeId": 804,
                "ServiceName": "Some service B2",
                "Name": "B2",
                "Duration": 30,
                "DurationForClient": 30,
                "Order": 5,
                "EmployeeId": 3700
            },
        {
                "Id": 5248,
                "ServiceTypeId": 804,
                "ServiceName": "Some service B2",
                "Name": "B2",
                "Duration": 30,
                "DurationForClient": 30,
                "Order": 5,
                "EmployeeId": 3683
            }
        ],
        "Order": 5
    }
]


//TASK: The goal is to remove duplicate object (leave just one) from an array object GroupedServices
// the key for this distinction is "Id".
// example: 
//            {
//                "Id": 5254,
//                "ServiceTypeId": 805,
//                "ServiceName": "Some service A2",
//                "Name": "A2",
//                "Duration": 30,
//                "DurationForClient": 30,
//                "Order": 4,
//                "EmployeeId": 3683
//            },
//            {
//                "Id": 5254,
//                "ServiceTypeId": 805,
//                "ServiceName": "Some service A6",
//                "Name": "A2",
//                "Duration": 30,
//                "DurationForClient": 30,
//                "Order": 4,
//                "EmployeeId": 3684
//           }
//=> in this case we need to remove second object, because it has same Id with a first object (Id: 5254) 

//WHAT I HAVE BEEN TRIED:
var uniqueGroupedServices = Array.from(filteredSerivces.GroupedServices().reduce((map, obj) => map.set(obj.Id, obj), new Map()).values());



    
    
  console.log(uniqueGroupedServices);

}

<input type="button" onclick="display_message();" value="click"/>

But obviously my code doesn't work. I guess I need to iterate for each in this main array to approach to GroupedServices but I don't know how. Also, how can I remove second occasion of same object (same Id)?

CodePudding user response：

Here is util method uniqById, using set and filter

const uniqById = (arr) => {
  const track = new Set();
  return arr.filter(({ Id }) => (track.has(Id) ? false : track.add(Id)));
};

const filteredSerivces=[{ServiceTypeId:805,ServiceTypeName:"Custom Services 1",GroupedServices:[{Id:5247,ServiceTypeId:805,ServiceName:"Some service A2",Name:"A1",Duration:30,DurationForClient:30,Order:4,EmployeeId:3683},{Id:5254,ServiceTypeId:805,ServiceName:"Some service A2",Name:"A2",Duration:30,DurationForClient:30,Order:4,EmployeeId:3683},{Id:5254,ServiceTypeId:805,ServiceName:"Some service A6",Name:"A2",Duration:30,DurationForClient:30,Order:4,EmployeeId:3684}],Order:4},{ServiceTypeId:804,ServiceTypeName:"Custom Services 2",GroupedServices:[{Id:5246,ServiceTypeId:804,ServiceName:"Some service B1",Name:"B1",Duration:30,DurationForClient:30,Order:5,EmployeeId:3696},{Id:5248,ServiceTypeId:804,ServiceName:"Some service B2",Name:"B2",Duration:30,DurationForClient:30,Order:5,EmployeeId:3700},{Id:5248,ServiceTypeId:804,ServiceName:"Some service B2",Name:"B2",Duration:30,DurationForClient:30,Order:5,EmployeeId:3683}],Order:5}];

const output = filteredSerivces.map((item) => ({
  ...item,
  GroupedServices: uniqById(item.GroupedServices),
}));

console.log(output);

CodePudding user response：

Haven't looked at it too closely. Are you wanting to remove dups for each element or for the whole list ?

function display_message() {
  let filteredSerivces =  
  [
    {
        "ServiceTypeId": 805,
        "ServiceTypeName": "Custom Services 1",
        "GroupedServices": [
            {
                "Id": 5247,
                "ServiceTypeId": 805,
                "ServiceName": "Some service A2",
                "Name": "A1",
                "Duration": 30,
                "DurationForClient": 30,
                "Order": 4,
                "EmployeeId": 3683
            },
            {
                "Id": 5254,
                "ServiceTypeId": 805,
                "ServiceName": "Some service A2",
                "Name": "A2",
                "Duration": 30,
                "DurationForClient": 30,
                "Order": 4,
                "EmployeeId": 3683
            },
            {
                "Id": 5254,
                "ServiceTypeId": 805,
                "ServiceName": "Some service A6",
                "Name": "A2",
                "Duration": 30,
                "DurationForClient": 30,
                "Order": 4,
                "EmployeeId": 3684
            }
        ],
        "Order": 4
    },
    {
        "ServiceTypeId": 804,
        "ServiceTypeName": "Custom Services 2",
        "GroupedServices": [
            {
                "Id": 5246,
                "ServiceTypeId": 804,
                "ServiceName": "Some service B1",
                "Name": "B1",
                "Duration": 30,
                "DurationForClient": 30,
                "Order": 5,
                "EmployeeId": 3696
            },
            {
                "Id": 5248,
                "ServiceTypeId": 804,
                "ServiceName": "Some service B2",
                "Name": "B2",
                "Duration": 30,
                "DurationForClient": 30,
                "Order": 5,
                "EmployeeId": 3700
            },
        {
                "Id": 5248,
                "ServiceTypeId": 804,
                "ServiceName": "Some service B2",
                "Name": "B2",
                "Duration": 30,
                "DurationForClient": 30,
                "Order": 5,
                "EmployeeId": 3683
            }
        ],
        "Order": 5
    }
];
for (const [key, value] of Object.entries(filteredSerivces)) {
    var uniqueGroupedServices = Array.from(value.GroupedServices.reduce((map, obj) => map.set(obj.Id, obj), new Map()).values());
    document.getElementById('results').innerHTML = document.getElementById('results').innerHTML JSON.stringify(uniqueGroupedServices,null,2);
}

}

<pre id = "results"></pre>
<input type="button" onclick="display_message();" value="click"/>