How to Remove Duplicates in JSON Array JavaScript ?
Last Updated :
16 Apr, 2024
In JavaScript, removing duplicates from a JSON array is important for data consistency and efficient processing. We will explore three different approaches to remove duplicates in JSON array JavaScript.
Use the methods below to remove Duplicates in JSON Array JavaScript.
Using Set
In this approach, we use the Set object to automatically remove duplicates by converting the JSON array to a Set using map and JSON.stringify, then back to an array using Array. from and JSON.parse.
Example: The below example uses Set to remove duplicates in JSON array JavaScript.
JavaScript
let jArr = [{
"id": 1,
"title": "Introduction to Algorithms"
},
{
"id": 2,
"title": "Data Structures and Algorithms"
},
{
"id": 1,
"title": "Introduction to Algorithms"
},
{
"id": 3,
"title": "Dynamic Programming"
},
{
"id": 2,
"title": "Data Structures and Algorithms"
},
];
let res = Array.from(new Set(jArr.map(JSON.stringify)))
.map(JSON.parse);
console.log(res);
Output[
{ id: 1, title: 'Introduction to Algorithms' },
{ id: 2, title: 'Data Structures and Algorithms' },
{ id: 3, title: 'Dynamic Programming' }
]
Using forEach Loop
In this approach, we are using a forEach loop to iterate over the JSON array "jArr", maintaining a check for unique id values using an object id, and adding only the unique objects to the result array res. This method makes sure that duplicate objects are excluded based on their "id" property, resulting in a filtered array containing only distinct elements.
Example: The below example uses forEach Loop to remove duplicates in JSON array JavaScript.
JavaScript
let jArr = [{
"id": 1,
"title": "Introduction to Algorithms"
},
{
"id": 2,
"title": "Data Structures and Algorithms"
},
{
"id": 1,
"title": "Introduction to Algorithms"
},
{
"id": 3,
"title": "Dynamic Programming"
},
{
"id": 2,
"title": "Data Structures and Algorithms"
},
];
let res = [];
let ids = {};
jArr.forEach(obj => {
if (!ids[obj.id]) {
ids[obj.id] = true;
res.push(obj);
}
});
console.log(res);
Output[
{ id: 1, title: 'Introduction to Algorithms' },
{ id: 2, title: 'Data Structures and Algorithms' },
{ id: 3, title: 'Dynamic Programming' }
]
Using filter Method
In this approach, we are using the filter method along with findIndex to create a new array "res" by checking for the first occurrence of each object based on its id and title properties, removing duplicates from the JSON array "jArr". This method ensures that unique objects are retained in the filtered array by comparing each object's ID and title values with previous elements.
Example: The below example uses the filter Method to remove duplicates in JSON array JavaScript.
JavaScript
let jArr = [{
"id": 1,
"title": "Introduction to Algorithms"
},
{
"id": 2,
"title": "Data Structures and Algorithms"
},
{
"id": 1,
"title": "Introduction to Algorithms"
},
{
"id": 3,
"title": "Dynamic Programming"
},
{
"id": 2,
"title": "Data Structures and Algorithms"
},
];
let res = jArr.filter((obj, index, self) =>
index === self.findIndex((t) => (
t.id === obj.id && t.title === obj.title
))
);
console.log(res);
Output[
{ id: 1, title: 'Introduction to Algorithms' },
{ id: 2, title: 'Data Structures and Algorithms' },
{ id: 3, title: 'Dynamic Programming' }
]
Similar Reads
How to Remove Duplicates from an Array of Objects in JavaScript? Here are some effective methods to remove duplicates from an array of objects in JavaScript1. Using filter() and findIndex() Methods - Most UsedThe simplest way to remove duplicates is by using filter() and findIndex(). This method keeps the first occurrence of each object with a unique property (li
3 min read
How to Remove Duplicate Objects from an Array in JavaScript? In JavaScript, it's a common example that the arrays contain objects and there might be a possibility that the objects may or may not be unique. Removing these duplicate objects from the array and getting the unique ones is a common task in Web Development. These are the following approaches: Table
2 min read
How to Remove duplicate elements from array in JavaScript ? In this article, we will discuss the methods to remove duplicate elements from a Javascript array. There are various methods to remove duplicates in the array. These are the following ways: Table of Content Using filter() MethodUsing set() MethodUsing forEach() MethodUsing reduce() MethodUsing index
4 min read
How to Regroup JSON array in JavaScript Regrouping JSON arrays in JavaScript is crucial for organizing data efficiently, simplifying data management tasks, and ensuring better data integration across systems. Here, we will regroup JSON arrays in JavaScript in two methods to achieve this using the reduce method and an iterative approach. T
3 min read
How to Merge Two Arrays and Remove Duplicate Items in JavaScript? Given two arrays, the task is to merge both arrays and remove duplicate items from merged array in JavaScript. The basic method to merge two arrays without duplicate items is using spread operator and the set constructor.1. Using Spread Operator and Set() ConstructorThe Spread Operator is used to me
3 min read
How to Splice Duplicate Item from JavaScript Array? Given an array of numbers or strings containing some duplicate values, the task is to remove these duplicate values from the array without creating a new array or storing the duplicate values anywhere else.Examples: Input: arr = [1, 2, 3, 4, 3, 2, 1];Output: [1,2,3,4]Input: [1, 4, 6, 1, 2, 5, 2, 1,
4 min read