get the first of duplicates in array of objects javascript

Question

I have the following data structure that i receive from the api:

[
  {
    id: '10000844',
    text_id: '10000844-01',
  },
  {
    id: '10000844',
    text_id: '10000844-02',
  },
  {
    id: '12000844',
    text_id: '12000844-03',
  },
  {
    id: '12000844',
    text_id: '12000844-07',
  },
  {
    id: '12000814',
    text_id: '12000844-07',
  },
 {
    id: '12002812',
    text_id: '12000844-07',
  },
   {
    id: '12000814',
    text_id: '12000844-08',
  },
]

The perfect outcome of cleaning the code would be this result, basically returning only the first found id:

[
      {
        id: '10000844',
        text_id: '10000844-01',
      },
      {
        id: '12000844',
        text_id: '12000844-03',
      },
      {
        id: '12000814',
        text_id: '12000844-07',
      },
     {
        id: '12002812',
        text_id: '12000844-07',
      },
    ]

But currently it only returns the last found duplicate in a unique array, with the current code:

let uniqueArray = [...new Map(data.map(item =>
    [item.id, item])).values()];

stackoverflow.com/questions/2218999/…

cmgchess
– cmgchess

2022-06-29 06:39:45 +00:00
Commented Jun 29, 2022 at 6:39 — cmgchess
– cmgchess, Commented Jun 29, 2022 at 6:39
I think you need to group and keep an array of text_ids

Ele
– Ele

2022-06-29 07:20:34 +00:00
Commented Jun 29, 2022 at 7:20 — Ele
– Ele, Commented Jun 29, 2022 at 7:20

Xupitan · Accepted Answer · 2022-06-29 07:01:31Z

5

You can use Object.values() and reduce() same as :

const data = [
  {
    id: '10000844',
    text_id: '10000844-01',
  },
  {
    id: '10000844',
    text_id: '10000844-02',
  },
  {
    id: '12000844',
    text_id: '12000844-03',
  },
  {
    id: '12000844',
    text_id: '12000844-07',
  },
  {
    id: '12000814',
    text_id: '12000844-07',
  },
 {
    id: '12002812',
    text_id: '12000844-07',
  },
   {
    id: '12000814',
    text_id: '12000844-08',
  },
]

const result = Object.values(
  data.reduce((res, {id, text_id}) => {
    res[id] ??= {id, text_id}
    return res
  }, {})
)
console.log(result)

Update with ??= document

The logical nullish assignment (x ??= y) operator only assigns if x is nullish (null or undefined).

edited Jun 29, 2022 at 7:01

answered Jun 29, 2022 at 6:49

Xupitan

1,6891 gold badge10 silver badges13 bronze badges

Sign up to request clarification or add additional context in comments.

4 Comments

Andy Over a year ago

You may want to explain what ??= does.

Xupitan Over a year ago

You can check it in : developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/…

Andy Over a year ago

:) I know what it means but it's a relatively new feature so might be confusing. +1 for updating your answer.

Xupitan Over a year ago

I understood what you meant so I updated the answer

mgm793 · Accepted Answer · 2022-06-29 06:42:42Z

0

You can do it like this:

const arr = [
  {
    id: '10000844',
    text_id: '10000844-01',
  },
  {
    id: '10000844',
    text_id: '10000844-02',
  },
  {
    id: '12000844',
    text_id: '12000844-03',
  },
  {
    id: '12000844',
    text_id: '12000844-07',
  },
  {
    id: '12000814',
    text_id: '12000844-07',
  },
 {
    id: '12002812',
    text_id: '12000844-07',
  },
   {
    id: '12000814',
    text_id: '12000844-08',
  },
];
const unique = [];
const visited = new Set();
for(let i = 0; i < arr.length; ++i){
  if(!visited.has(arr[i].id)){
    unique.push(arr[i]);
    visited.add(arr[i].id);
  }
}

console.log(unique);

answered Jun 29, 2022 at 6:42

mgm793

2,08618 silver badges26 bronze badges

1 Comment

Andy Over a year ago

"You can do it like this" is not good documentation for an answer.

holydragon · Accepted Answer · 2022-06-29 06:45:43Z

0

Concept

Loop through all the objects in the data and check if the id is found in result array. If not found then push it into the result array; otherwise, skip it.

Code

const data = [{
    id: '10000844',
    text_id: '10000844-01',
  },
  {
    id: '10000844',
    text_id: '10000844-02',
  },
  {
    id: '12000844',
    text_id: '12000844-03',
  },
  {
    id: '12000844',
    text_id: '12000844-07',
  },
  {
    id: '12000814',
    text_id: '12000844-07',
  },
  {
    id: '12002812',
    text_id: '12000844-07',
  },
  {
    id: '12000814',
    text_id: '12000844-08',
  },
];
let result = [];
let found;
data.forEach(d => {
  found = false;
  result.forEach(r => {
    if (!found && r.id === d.id) found = true;
  })
  if (!found) result.push(d);
});
console.log(result);

answered Jun 29, 2022 at 6:45

holydragon

6,7687 gold badges48 silver badges76 bronze badges

1 Comment

mgm793 Over a year ago

If the ids are not in order this will not work be careful!

Mohit Sharma · Accepted Answer · 2022-06-29 06:50:01Z

Here is another way to achieve you desire output.
we use reduce for changing in data and use find function to get current id is already in prev or not if not then we use filter function to filter out same id object and push only first.

const data =[
  {
    id: '10000844',
    text_id: '10000844-01',
  },
  {
    id: '10000844',
    text_id: '10000844-02',
  },
  {
    id: '12000844',
    text_id: '12000844-03',
  },
  {
    id: '12000844',
    text_id: '12000844-07',
  },
  {
    id: '12000814',
    text_id: '12000844-07',
  },
 {
    id: '12002812',
    text_id: '12000844-07',
  },
   {
    id: '12000814',
    text_id: '12000844-08',
  },
]

const newData = data.reduce((prev, curr, index, arr) => {
  const find = prev.find(p => p.id === curr.id);
  if (!find) {
    const filter = arr.filter(f => f.id === curr.id);
    if (filter.length >= 1) {
      prev.push(filter[0])
    }
  }
  return prev;
}, [])

console.log(newData)

Som Shekhar Mukherjee · Accepted Answer · 2022-06-29 06:54:27Z

0

You can reduce the array into an object that stores only the first occurrence of every id and then extract the values from this object.

const 
  data = [{ id: "10000844", text_id: "10000844-01" }, { id: "10000844", text_id: "10000844-02" }, { id: "12000844", text_id: "12000844-03" }, { id: "12000844", text_id: "12000844-07" }, { id: "12000814", text_id: "12000844-07" }, { id: "12002812", text_id: "12000844-07" }, { id: "12000814", text_id: "12000844-08" }],
  result = Object.values(data.reduce((acc, d) => (!acc[d.id] ? { ...acc, [d.id]: d } : acc), {}));

console.log(result);

edited Jun 29, 2022 at 6:54

answered Jun 29, 2022 at 6:49

Som Shekhar Mukherjee

8,1982 gold badges16 silver badges34 bronze badges

1 Comment

Andy Over a year ago

You may want to document how that one-liner works since it will be gibberish to beginners.

I am L · Accepted Answer · 2022-06-29 06:57:17Z

0

Some of the answers are already correct.

THIS ANSWER IS ONLY IF YOU ARE USING LODASH

You can use uniqBy.

This will return a duplicate-free version of an array where the first occurrence is the one that will be kept:

So in your case, something like

import uniqBy from 'lodash/uniqBy';

// dataFromAPI is your sample data
const unqiueArray = uniqBy(dataFromAPI, 'id');

answered Jun 29, 2022 at 6:57

I am L

4,6806 gold badges38 silver badges55 bronze badges

Comments

Andy · Accepted Answer · 2022-06-29 07:15:04Z

Sometimes a simple loop is the way forward.

Create a temporary object
Iterate over the data adding objects to that object if their key can't be found.
Get the values of the output object

const data=[{id:"10000844",text_id:"10000844-01"},{id:"10000844",text_id:"10000844-02"},{id:"12000844",text_id:"12000844-03"},{id:"12000844",text_id:"12000844-07"},{id:"12000814",text_id:"12000844-07"},{id:"12002812",text_id:"12000844-07"},{id:"12000814",text_id:"12000844-08"}];

// Initialise the output object
const out = {};

// Loop over the array of objects
for (const obj of data) {

  // For each object destructure the id from the rest
  // of its properties 
  const { id, ...rest } = obj;

  // If there is no property on the output
  // object with that key create it by adding
  // an object composed of the id and the other
  // object properties to it
  out[id] ??= { id, ...rest };
}

// Now return an array of
// the output object's values
console.log(Object.values(out));

Additional documentation

Collectives™ on Stack Overflow

get the first of duplicates in array of objects javascript

7 Answers 7

4 Comments

1 Comment

1 Comment

Comments

1 Comment

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

7 Answers 7

4 Comments

1 Comment

1 Comment

Comments

1 Comment

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related