In this post, we will take a look at the challenge of detecting if an array has duplicates.
Equality on primitives vs objects
First of all, what is a duplicate value?
For primitive values this is obvious. Take for example the following array of strings.
['A', 'B', 'B', 'C']In this case, the string 'B' is a duplicate. Note that two strings containing the same characters are equal 'B' === 'B'.
What about objects? Check the next array.
[{ char: 'A'}, { char: 'A'}]You may consider that the previous array contains duplicates, but JavaScript doesn't think so. Two objects having the same properties and storing the same values are not equal.
{ char: 'A'} !== { char: 'A'}
//trueWe will need to discuss and find a solution also for this case. Let's now start solving our challenge.
Detecting duplicates in arrays of primitives
Remember that in JavaScript besides arrays we also have Set collections.
Sets are collections of unique values.
As you can understand values are unique in a Set collection. We can simply transform the array into a Set and create a new collection without duplicates. Then we can compare the size of the Set collection with the size of the original array and detect if it has duplicates.
Here is how we can do it.
const arr = [1, 1, 1, 2, 3];
const set = new Set(arr);
const hasDuplicates = set.size < arr.length;
console.log(hasDuplicates)
//trueBy sending the whole array to new Set constructor we create a set collection containing all unique values from the original array.
The length property gets the size of the array.
The size property retrieves the size of the Set collection.
Detecting duplicates in arrays of objects
What about objects? Does the previous logic work also for objects?
Let's try out.
const arr = [{char: 'A'}, {char: 'A'}];
const set = new Set(arr);
const hasDuplicates = set.size < arr.length;
console.log(hasDuplicates)
//falseIt doesn't work. As already said two objects storing the same values are not equal.
What can we do then?
We can, for example, transform an object into a JSON string. Two objects with the same properties and storing the same values will produce the same JSON string. Check how we can do that using the JSON.stringify function.
const obj1 = { char: 'A' };
const obj2 = { char: 'A' };
const jsonObj1 = JSON.stringify(obj1);
//{"char":"A"}
const jsonObj2 = JSON.stringify(obj2);
//{"char":"A"}
console.log(obj1 === obj2);
//false
console.log(jsonObj1 === jsonObj2);
//trueNow let's use the JSON.stringify function together with the Set collection. Instead of creating a Set of objects, we can create a Set of JSON strings.
How can we do this transformation from an array of objects to an array of JSON strings?
The map array method converts an array of values into a new array using a mapping function.
What is the mapping function in our case?
That's right. The mapping function, in this case, is the JSON.stringify. Let's pass it to the map method and check the result.
const arr = [{char: 'A'}, {char: 'A'}];
const jsonArr = arr.map(JSON.stringify);
console.log(jsonArr);
//[
//"{"char":"A"}",
//"{"char":"A"}"
//]Here is the code for detecting duplicates in an array of objects.
const arr = [{char: 'A'}, {char: 'A'}];
const set = new Set(arr.map(JSON.stringify));
const hasDuplicates = set.size < arr.length;
console.log(hasDuplicates)
//trueWhat if we don't want to compare all the properties of an object to find duplicates. What if we just need to compare the id property for example.
OK. This is even simpler than what we have already done. Instead of creating a new Set of objects, we create a new Set of ids. This set will contain only the unique ids.
Who can we convert a list of objects into a list of ids?
Yes, simply by using the map array method.
const arr = [
{id: 1, name: 'Joker'},
{id: 2, name: 'Bane'},
{id: 1, name: 'Joker' }
];
const ids = arr.map(obj => obj.id);
console.log(ids);
//[1, 2, 1]Below is the logic checking for duplicates.
const set = new Set(ids);
const hasDuplicates = set.size < arr.length;
console.log(hasDuplicates)
//trueThat is all about checking duplicates inside an array. Here is How to Remove Duplicates from Arrays. Thanks for reading.
