Remove duplicate value from array

There are multiple ways to filter out duplicates from an array and return only the unique values.

1️⃣ Using Set ?

What is Set?

Set is a new data object introduced in ES6. A Set is a collection of unique values.

Here,

The array…


This content originally appeared on DEV Community and was authored by Suprabha

There are multiple ways to filter out duplicates from an array and return only the unique values.

1️⃣ Using Set ?

What is Set?

Set is a new data object introduced in ES6. A Set is a collection of unique values.

Here,

  • The array is converted to Set and all the duplicate elements are automatically removed.
  • The spread syntax ... is used to include all the elements of the Set to a new array.
const arr = ["?", "?", "?", "?", "?", "?", "?"];

const filteredArr = [...new Set(arr)];
console.log(filteredArr); //["?", "?", "?", "?", "?"]

Convert Set to an Array using Array.from

You can also use Array.from to convert a Set into an array:

const arr = ["?", "?", "?", "?", "?", "?", "?"];

const filteredArr = Array.from(new Set(arr));
console.log(filteredArr); //["?", "?", "?", "?", "?"]

2️⃣ Using filter ?

If the element passes and returns true, it will be included in the filtered array and any element that fails or return false, it will be NOT be in the filtered array.

const arr = ["?", "?", "?", "?", "?", "?", "?"];

const filteredArr = arr.filter((item, index) => {
    return arr.indexOf(item) === index;
})
console.log(filteredArr); //["?", "?", "?", "?", "?"]

3️⃣ Using forEach Method ?

Using forEach, you can iterate over the elements in the array and push into the new array if it doesn’t exist in the array.

const arr = ["?", "?", "?", "?", "?", "?", "?"];

const filteredArr = (arr) => {
    let uniqueVal = [];
    arr.forEach(el => {
        if(!uniqueVal.includes(el)) {
            uniqueVal.push(el);
        }
    })
    return uniqueVal;
}
console.log(filteredArr(arr)); //["?", "?", "?", "?", "?"]

4️⃣ Using Reduce Method ?

The reduce method is used to reduce the elements of the array and combine them into a final array based on some reducer function that you pass.

const arr = ["?", "?", "?", "?", "?", "?", "?"];

const filteredArr = arr.reduce((acc, curr) => {
    return acc.includes(curr) ? acc : [...acc, curr];
}, [])
console.log(filteredArr(arr)); //["?", "?", "?", "?", "?"]

5️⃣ Unique Method to the Array Prototype ?

In Javascript the array prototype constructor allows you to add new properties and methods to the Array object.

const arr = ["?", "?", "?", "?", "?", "?", "?"];

Array.prototype.filteredArr = function (){
    let arr = [];
    for(let i = 0; i < this.length; i++) {
        let current = this[i];
        if(arr.indexOf(current) < 0 ) arr.push(current);
    }
    return arr;
}
console.log(arr.filteredArr()); //["?", "?", "?", "?", "?"]

Reference ?


This content originally appeared on DEV Community and was authored by Suprabha


Print Share Comment Cite Upload Translate Updates
APA

Suprabha | Sciencx (2021-05-14T19:49:18+00:00) Remove duplicate value from array. Retrieved from https://www.scien.cx/2021/05/14/remove-duplicate-value-from-array/

MLA
" » Remove duplicate value from array." Suprabha | Sciencx - Friday May 14, 2021, https://www.scien.cx/2021/05/14/remove-duplicate-value-from-array/
HARVARD
Suprabha | Sciencx Friday May 14, 2021 » Remove duplicate value from array., viewed ,<https://www.scien.cx/2021/05/14/remove-duplicate-value-from-array/>
VANCOUVER
Suprabha | Sciencx - » Remove duplicate value from array. [Internet]. [Accessed ]. Available from: https://www.scien.cx/2021/05/14/remove-duplicate-value-from-array/
CHICAGO
" » Remove duplicate value from array." Suprabha | Sciencx - Accessed . https://www.scien.cx/2021/05/14/remove-duplicate-value-from-array/
IEEE
" » Remove duplicate value from array." Suprabha | Sciencx [Online]. Available: https://www.scien.cx/2021/05/14/remove-duplicate-value-from-array/. [Accessed: ]
rf:citation
» Remove duplicate value from array | Suprabha | Sciencx | https://www.scien.cx/2021/05/14/remove-duplicate-value-from-array/ |

Please log in to upload a file.




There are no updates yet.
Click the Upload button above to add an update.

You must be logged in to translate posts. Please log in or register.