Removing Duplicate Array Values And Then Storing Them [react]

I'm trying to strip the duplicate array values from my current array. And I'd like to store the fresh list (list without duplicates) into a new variable. var names = ['Daniel','Lu

Solution 1:

You can do it in a one-liner

const uniqueNames = Array.from(newSet(names));

// it will return a collection of unique items

Note that @Wild Widow pointed out one of your mistake - you did not use the return statement. (it sucks when we forget, but it happens!)

I will add to that that you code could be simplified and the callback could be more reusable if you take into account the third argument of the filter(a,b,c) function - where c is the array being traversed. With that said you could refactor your code as follow:

const uniqueNames = names.filter((val, id, array) => {
   return array.indexOf(val) == id;  
});

Also, you won't even need a return statement if you use es6

const uniqueNames = names.filter((val,id,array) => array.indexOf(val) == id);

Solution 2:

you forgot to use return statement in the filter call

const namesArr = duplicatesArray.filter(function(elem, pos) {
    return duplicatesArray.indexOf(elem) == pos;
}); 

Solution 3:

If you want to remove duplicate values which contains same "id", You can use this.

const arr = [
  { id: 2, name: "sumit" },
  { id: 1, name: "amit" },
  { id: 3, name: "rahul" },
  { id: 4, name: "jay" },
  { id: 2, name: "ra one" },
  { id: 3, name: "alex" },
  { id: 1, name: "devid" },
  { id: 7, name: "sam" },
  ];

---

functiongetUnique(arr, index) {

  const unique = arr
       .map(e => e[index])

       // store the keys of the unique objects
       .map((e, i, final) => final.indexOf(e) === i && i)

       // eliminate the dead keys & store unique objects
      .filter(e => arr[e]).map(e => arr[e]);      

   return unique;
}

console.log(getUnique(arr,'id'))

---

Result :

> Array 
[ 
  { id: 2, name: "sumit" },
  { id: 1, name: "amit" },
  { id: 3, name: "rahul" },  
  { id: 4, name: "jay" },  
  { id: 7, name: "sam" }
]

Solution 4:

Since I found the code of @Infaz 's answer used somewhere and it confused me greatly, I thought I would share the refactored function.

functiongetUnique(array, key) {
  if (typeof key !== 'function') {
    const property = key;
    key = function(item) { return item[property]; };
  }
  returnArray.from(array.reduce(function(map, item) {
    const k = key(item);
    if (!map.has(k)) map.set(k, item);
    return map;
  }, newMap()).values());
}

// Exampleconst items = [
  { id: 2, name: "sumit" },
  { id: 1, name: "amit" },
  { id: 3, name: "rahul" },
  { id: 4, name: "jay" },
  { id: 2, name: "ra one" },
  { id: 3, name: "alex" },
  { id: 1, name: "devid" },
  { id: 7, name: "sam" },
];
console.log(getUnique(items, 'id'));
/*Output:
[ 
  { id: 2, name: "sumit" },
  { id: 1, name: "amit" },
  { id: 3, name: "rahul" },  
  { id: 4, name: "jay" },  
  { id: 7, name: "sam" }
]
*/

Solution 5:

Also you can do this

{Array.from(newSet(yourArray.map((j) => j.location))).map((location) => (
          <optionvalue={`${location}`}>{location}</option>
        ))}