Removing items from an array

Question

Removing items from an array

I'm currently developing an Angular application and I have an array named "*identify duplicates" that looks like the following:

[
  {
   Name: "Jack",
   Id: "1"
  },
  {
    Name: "Rose",
    Id: "2"
  },
  {
    Name: "Jack",
    Id: "4"
  },
  {
    Name: "Jack",
    Id: "4"
  }
]

My goal is to remove duplicate entries in the array based on both the name and id. For example, in the last two indexes of the array, the name and id are the same for "Jack", so I want to delete these duplicates. However, I do not want to delete data if the names are the same but the ids are different. In the above example, I would like to keep the entry for Jack with the id "1" in my array, but remove the last two entries for Jack with the id "4". How can I achieve this?

javascript angular typescript angular8

Answer 1

Answer №1

There are multiple approaches to achieving this task, such as using filter, reduce, map, and more. Below, I have provided two examples:

The first example employs the forEach method. It iterates through the array, filters out elements with the same Name, and adds them to a new array.

In the second example, the reduce method is utilized to filter elements based on the Name property and add them to a new array.

var arr=[{Name: "Jack",Id: "1"},{Name: "Rose",Id: "2"},{Name: "Jack", Id: "4"},{Name: "Jack", Id: "4"}];

// Using simple foreach method
var result=[];
arr.forEach(el=>{
  if(result.filter(x=>x.Name==el.Name).length==0){result.push(el);}
});
console.log(result);

// Using reduce method
var result2=arr.reduce((r, { Name, Id }) => {
    var temp = r.find(o => Name === o.Name);
    if (!temp) { r.push(temp = { Name, Id });}
    return r;
}, []);
console.log(result2);

Answer 2

There are multiple approaches to achieving this task, such as using filter, reduce, map, and more. Below, I have provided two examples:

The first example employs the forEach method. It iterates through the array, filters out elements with the same Name, and adds them to a new array.

In the second example, the reduce method is utilized to filter elements based on the Name property and add them to a new array.

var arr=[{Name: "Jack",Id: "1"},{Name: "Rose",Id: "2"},{Name: "Jack", Id: "4"},{Name: "Jack", Id: "4"}];

// Using simple foreach method
var result=[];
arr.forEach(el=>{
  if(result.filter(x=>x.Name==el.Name).length==0){result.push(el);}
});
console.log(result);

// Using reduce method
var result2=arr.reduce((r, { Name, Id }) => {
    var temp = r.find(o => Name === o.Name);
    if (!temp) { r.push(temp = { Name, Id });}
    return r;
}, []);
console.log(result2);

Answer 3

Answer №2

Utilizing the Map() function

const data = [{Name:"John",Id:"3"},{Name:"Mary",Id:"5"},{Name:"Jane",Id:"7"},{Name:"John",Id:"9"}]

let result = [...data.reduce((accumulator, item) => accumulator.has(item.Name) ? accumulator : accumulator.set(item.Name, item), new Map).values()]

console.log(result)

Answer 4

Utilizing the Map() function

const data = [{Name:"John",Id:"3"},{Name:"Mary",Id:"5"},{Name:"Jane",Id:"7"},{Name:"John",Id:"9"}]

let result = [...data.reduce((accumulator, item) => accumulator.has(item.Name) ? accumulator : accumulator.set(item.Name, item), new Map).values()]

console.log(result)

Answer 5

Answer №3

Give this a shot:

let data = [
{
 "Name": "Alice",
 "Id": "9"
},
{
  "Name": "Bob",
  "Id": "3"
},
{
  "Name": "Charlie",
  "Id": "6"
}
]    
let jsonData = data.map(JSON.stringify); 
console.log(jsonData); 
let uniqueSet = new Set(jsonData); 
let uniqueArray = Array.from(uniqueSet).map(JSON.parse); 
console.log(uniqueArray);

Answer 6

Give this a shot:

let data = [
{
 "Name": "Alice",
 "Id": "9"
},
{
  "Name": "Bob",
  "Id": "3"
},
{
  "Name": "Charlie",
  "Id": "6"
}
]    
let jsonData = data.map(JSON.stringify); 
console.log(jsonData); 
let uniqueSet = new Set(jsonData); 
let uniqueArray = Array.from(uniqueSet).map(JSON.parse); 
console.log(uniqueArray);

Answer 7

Answer №4

If you're interested in streamlining your code with Javascript libraries like underscore or lodash, I suggest checking out the _.uniq function available in those libraries. For example, using lodash:

var arr=[ { Name: "Jack", Id: "1" }, { Name: "Rose", Id: "2" }, { Name: "Jack", Id: "4" }, { Name: "Jack", Id: "4" } ]; var updated_data = _.uniq(arr, 'Name');

Answer 8

If you're interested in streamlining your code with Javascript libraries like underscore or lodash, I suggest checking out the _.uniq function available in those libraries. For example, using lodash:

var arr=[ { Name: "Jack", Id: "1" }, { Name: "Rose", Id: "2" }, { Name: "Jack", Id: "4" }, { Name: "Jack", Id: "4" } ]; var updated_data = _.uniq(arr, 'Name');

Removing items from an array

Answer №1

Answer №2

Answer №3

Answer №4

Similar questions

Using jQuery to send arrays to PHP with $.getJSON

What is the most efficient way to transfer sample code to the clipboard by simply clicking a button?

What could be causing my redux action to trigger twice and what steps can I take to resolve this issue?

Getting started with html2canvas: A beginner's guide

Efficiently submit numerous forms through JQuery's ajax capabilities

Tips for aligning elements of varying heights

Filtering nested arrays in Javascript involves iterating through each nested

The issue of elements flickering while being hidden and shown with jQuery has been observed in both Chrome and

Inconsistent behavior occurs when the Angular code that functions perfectly in development fails to

InvalidTypeException: The properties accessed are undefined

Passing and Retrieving Specific Item from Mapped Array in React/Mobx: A guide on sending a single item from a mapped array to another component and accessing only

Inquiring about the best method to determine the intersection point between two lines in Draw i.o

Application error management tool/solution for efficient error handling and detection

Guide for generating a prototype string within a class in TypeScript

Can you explain the meaning of the code provided below?

Is the JQuery Mobile .page() method triggering an endless loop?

"Sending a file (Image) through NextJS API Routes to an external API: A step-by-step guide

What is the best approach to managing a Symfony form that contains TWO CollectionType child forms?

Is there a different technique I can use to display an axios response within a v-if statement? Any other methods I should

Why isn't the angularjs directive setting a value for a specific scope?