Finding the initial occurrence of duplicates within an array of objects using JavaScript

Question

Finding the initial occurrence of duplicates within an array of objects using JavaScript

I am working with a data structure retrieved from an API, and it looks like this:

[
  {
    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',
  },
]

After cleaning up the code, I want the result to only contain the first occurrence of each unique 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',
      },
    ]

However, my current code is only returning the last duplicate found in a unique array. Here is the snippet:

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

javascript arrays dictionary object unique

Answer 1

Answer №1

You have the option to utilize Object.values() and reduce() in the following way:

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)

Enhancement using ??= source

The logical nullish assignment (x ??= y) operator will solely assign

if x is nullish (null or undefined)

.

Answer 2

You have the option to utilize Object.values() and reduce() in the following way:

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)

Enhancement using ??= source

The logical nullish assignment (x ??= y) operator will solely assign

if x is nullish (null or undefined)

.

Answer 3

Answer №2

Follow these steps to achieve it:

const array = [
  {
    id: '10000844',
    text_id: '10000844-01',
  },
  {
    id: '12000814',
    text_id: '12000844-08',
  },
  {
    id: '12002812',
    text_id: '12000844-07',
  },
];
const uniqueValues = [];
const memory = new Set();
for(let index = 0; index < array.length; ++index){
  if(!memory.has(array[index].id)){
    uniqueValues.push(array[index]);
    memory.add(array[index].id);
  }
}

console.log(uniqueValues);

Answer 4

Follow these steps to achieve it:

const array = [
  {
    id: '10000844',
    text_id: '10000844-01',
  },
  {
    id: '12000814',
    text_id: '12000844-08',
  },
  {
    id: '12002812',
    text_id: '12000844-07',
  },
];
const uniqueValues = [];
const memory = new Set();
for(let index = 0; index < array.length; ++index){
  if(!memory.has(array[index].id)){
    uniqueValues.push(array[index]);
    memory.add(array[index].id);
  }
}

console.log(uniqueValues);

Answer 5

Answer №3

Approach:

To filter out unique objects based on the id field, iterate through the data array and only add items to the result array if their id is not already present in it.

Solution:

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);

Answer 6

Approach:

To filter out unique objects based on the id field, iterate through the data array and only add items to the result array if their id is not already present in it.

Solution:

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);

Answer 7

Answer №4

If you're looking for an alternative approach to achieve your desired output, here's a suggestion:
Utilize the power of the reduce method to manipulate the data and incorporate the find function to check if the current id already exists in the prev. If it does not exist, employ the filter function to eliminate duplicate id objects and only retain the first occurrence.

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)

Answer 8

If you're looking for an alternative approach to achieve your desired output, here's a suggestion:
Utilize the power of the reduce method to manipulate the data and incorporate the find function to check if the current id already exists in the prev. If it does not exist, employ the filter function to eliminate duplicate id objects and only retain the first occurrence.

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)

Answer 9

Answer №5

One way to achieve this is by utilizing the reduce method to transform the array into an object that retains only the first instance of each unique id, and then extracting the values from this modified 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);

Answer 10

One way to achieve this is by utilizing the reduce method to transform the array into an object that retains only the first instance of each unique id, and then extracting the values from this modified 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);

Answer 11

Answer №6

Some answers have been correct from the start.

IF YOU UTILIZE LODASH, CONSIDER THIS ANSWER

You have the option to utilize uniqBy.

This function will provide you with a version of the array without duplicates, keeping the first occurrence:

In your particular scenario, it would look something like this:

import uniqBy from 'lodash/uniqBy';

// Your sample data from the API
const uniqueArray = uniqBy(dataFromAPI, 'id');

Answer 12

Some answers have been correct from the start.

IF YOU UTILIZE LODASH, CONSIDER THIS ANSWER

You have the option to utilize uniqBy.

This function will provide you with a version of the array without duplicates, keeping the first occurrence:

In your particular scenario, it would look something like this:

import uniqBy from 'lodash/uniqBy';

// Your sample data from the API
const uniqueArray = uniqBy(dataFromAPI, 'id');

Answer 13

Answer №7

At times, opting for a straightforward loop can be the best approach.

Start by creating a temporary object
Go through the data and add objects to the temporary object if their key is not found
Retrieve the values from 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));

For more information, refer to:

Answer 14

At times, opting for a straightforward loop can be the best approach.

Start by creating a temporary object
Go through the data and add objects to the temporary object if their key is not found
Retrieve the values from 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));

For more information, refer to:

Finding the initial occurrence of duplicates within an array of objects using JavaScript

Answer №1

Answer №2

Answer №3

Answer №4

Answer №5

Answer №6

Answer №7

Similar questions

The additional pieces of information transmitted in the state are not being accurately interpreted

Error with Webdriver/FXDriver utils.js leading to Firefox unresponsive script issue

Is there a way to sort through nested objects with unspecified keys?

JavaScript query-string encoding

Creating a Countdown in Javascript Using a Variable

Populate a secondary dropdown menu using the selection from a primary dropdown menu and retrieve the corresponding "value" instead of displaying the value as a dropdown option

switch the visibility of the p tag based on its content

Utilizing AJAX and PHP for seamless communication, retrieve and authenticate HTTPS SSL CERTIFICATE when interacting

Exploring ways to cycle through an array of objects during a jQuery ajax request

Issue with submitting a form within a React modal - lack of triggering events

Issue encountered with Express.js and connect-mongo session: "TypeError - Unable to access property 'upserted' as it is undefined"

Styling multiple Higher Order Components (HoCs) using Material UI withStyles

Implementing script loading within the Angular scope

What is the best way to manage sessions in angularjs using javascript?

Leverage the AJAX Search Lite Plugin within the top navigation of your WordPress website's header file

Servlet question: What causes the XMLHttpRequest responseText to consistently appear empty?

w3schools example showcasing the power of AJAX

What is the best way to retrieve data from PHP and format it into JSON for use in my jQuery script?

Exploring the functionality of the JavaScript switch statement across various condition scenarios

Merge two JSON arrays without specifying which fields to combine explicitly