Home > Software design >  JavaScript: Remove duplicates from array of objects
JavaScript: Remove duplicates from array of objects

Time:11-18

I have an array of data which looks like this.

data = [ 
  { "name": "Apple", "type": "Fruit"}, 
  { "name": "Cabbage", "type": "Vegetable"} , 
  { "name": "Orange", "type": "Fruit"} 
] 

I want to filter out the element which its type already existed. And I want to keep the first element.

E.g. keep Apple instead of Orange

data = [ 
  { "name": "Apple", "type": "Fruit"},
  { "name": "Cabbage", "type": "Vegetable"}
]

CodePudding user response:

Using Array#filter, you can iterate over the array while updating a Set to keep track of types added:

const data = [ { "name": "Apple", "type": "Fruit"}, { "name": "Cabbage", "type": "Vegetable"}, { "name": "Orange", "type": "Fruit"} ];

const typeSet = new Set();
const res = data.filter(({ type }) => {
  if(typeSet.has(type)) return false;
  typeSet.add(type);
  return true;
});

console.log(res);
<iframe name="sif1" sandbox="allow-forms allow-modals allow-scripts" frameborder="0"></iframe>

CodePudding user response:

1) You can filter the result if type already not present in dict using filter and Set as:

data.filter((o) => (dict.has(o.type) ? false : dict.add(o.type, true)))

const data = [
  { name: "Apple", type: "Fruit" },
  { name: "Cabbage", type: "Vegetable" },
  { name: "Orange", type: "Fruit" },
];

const dict = new Set();
const result = data.filter((o) => (dict.has(o.type) ? false : dict.add(o.type, true)));
console.log(result)
<iframe name="sif2" sandbox="allow-forms allow-modals allow-scripts" frameborder="0"></iframe>

2) You can also use for..of and Set as:

const data = [
  { name: "Apple", type: "Fruit" },
  { name: "Cabbage", type: "Vegetable" },
  { name: "Orange", type: "Fruit" },
];

const dict = new Set(), result = [];

for (let o of data) {
  if (!dict.has(o.type)) {
    result.push(o);
    dict.add(o.type);
  }
}

console.log(result);
<iframe name="sif3" sandbox="allow-forms allow-modals allow-scripts" frameborder="0"></iframe>

  • Related