There will always be situations where we need to remove duplicates from an array, because we don't want to repeat a certain data in our project. When times like this arise, this tutorial is a great resource to visit and I can tell you for a fact, it will really be useful in those situations. And oh, I remember reading somewhere where someone talked about a technical interview they attempted, and they came across this subject. Well, I believe a lot of you will still attempt technical interviews like that one, and possibly come across a familiar question as that.
I will be showing you four (4) ways to remove duplicates in arrays, and it will be left for you to choose your most preferred method. For me, my most preferred is the first. Let's take a dive into our methods.
The Set() method:
This is my most preferred method in removing duplicates. Why? Because it's the shortest method and it's not complicated at all.
What does Set() do? It is an object whose values can only appear once. That's why it doesn't take a lot of codes to arrive at our desired result. Let's see Set in action.
const myArray = ['grapes', 'jake', 'jake', 'apples', 'mango', 'dance', 'jake']
const newArray = [...new Set(myArray)]
console.log(newArray);
Looking at the above code, jake appeared twice in our array, and then we used the Set method to filter one of the duplicates. And below is the result.
The reduce() method:
If you are familiar with the reduce method in JavaScript Arrays, you'll understand how this method works.
const myArray = ['grapes', 'jake', 'jake', 'apples', 'mango', 'dance', 'jake']
const newArray = (arr) =>{
const arrays = myArray.reduce(function (acc, curr) {
if (!acc.includes(curr))
acc.push(curr);
return acc;
}, []);
return arrays;
}
console.log(newArray(myArray));
This method returns a new set of arrays with no duplicates.
The forEach() method:
Another good method is the forEach method. We iterate over our original array and push our individual elements into a new set of arrays if they are not included in our new set of array already. Let's see how that works for a better understanding.
const myArray = ['grapes', 'jake', 'jake', 'apples', 'mango', 'dance', 'jake']
const newArray = (arr) =>{
const arrays = [];
myArray.forEach(element => {
if (!arrays.includes(element)) {
arrays.push(element);
}
});
return arrays;
}
console.log(newArray(myArray));
Our output will be the same as the previous methods; a new set of array with no duplicates.
The filter() method:
const myArray = ['grapes', 'jake', 'jake', 'apples', 'mango', 'dance', 'jake']
const newArray = (arr) =>{
return myArray.filter((item,
index) => myArray.indexOf(item) === index);
}
console.log(newArray(myArray));
The result:
I hope this article is clear and helpful enough and I hope you had a great read. Please LIKE and refer someone to read as well. Also, don’t forget to follow me.
Have a great day my friends.