Removing duplicates with in an object array using angular 4

Question

I have an array with below list of items as shown in image , I would like to remove the duplicates
[L7-LO, %L7-LO] from that array.

I have tried with the following conditions:

Scenario 1 :

this.formulalist.filter((el, i, a) => i == a.indexOf(el))

Scenario 2:

Observable.merge(this.formulalist).distinct((x) => x.Value)
          .subscribe(y => {
       this.formulalist.push(y)
   });

Scenario 3:

this.formulalist.forEach((item, index) => {
        if (index !== this.formulalist.findIndex(i => i.Value == item.Value)) 
        {
            this.formulalist.splice(index, 1);
        }

    });

None of the three scenarios above were able to remove the duplicates from that array. Could any one please help on this query?

Can you provide for us the array and the wanted result? Thank. — Mathias Gheno Azzolini, Jan 08 '19 at 19:11
Your third scenario is somewhat correct, It does not work because findIndex will give the first index, try to loop over the existing array, but populate a new array, do a findIndex in new array. Also, you should not splice the same array you are looping, it will start skipping elements then. — Ashish Ranjan, Jan 08 '19 at 19:19
Possible duplicate of [Remove duplicates from an array of objects in JavaScript](https://stackoverflow.com/questions/2218999/remove-duplicates-from-an-array-of-objects-in-javascript) — David Walschots, Jan 08 '19 at 19:55

score 6 · Answer 1 · answered Jan 08 '19 at 19:28

6

angular is not necessary use vanillajs filter the elements with only one occurrence and add to the new list the first occurrence

let newFormulalist =  formulalist.filter((v,i) => formulalist.findIndex(item => item.value == v.value) === i);

answered Jan 08 '19 at 19:28

imperezivan

761
5
13

Ashish Ranjan · Answer 2 · 2020-09-08T08:08:49.730

Try populating a new array without duplicates. Assign the new array later to formulalist.

newArr = []
this.formulalist.forEach((item, index) => {
    if (this.newArr.findIndex(i => i.Value == item.Value) === -1) 
    {
        this.newArr.push(item)
    }

});
this.formulalist = this.newArr

EDIT

Looking at the answer above, the solution seems so outdated. A better approach would have been to use an Array.filter() than a Array.forEach().

But, having a better solution would be nice, now when I see this question, I feel findIndex() not to be a good approach because of the extra traversal.

I may have a Set and store the values in the Set on which I want to filter, If the Set has those entries, I would skip those elements from the array.

Or a nicer approach is the one that is used by Akitha_MJ, very concise. One loop for the array length, an Object(Map) in the loop with keys being the value on which we want to remove duplicates and the values being the full Object(Array element) itself. On the repetition of the element in the loop, the element would be simply replaced in the Map. Later just take out the values from the Map.

score 2 · Answer 3 · answered Jan 03 '20 at 08:42

2

const result = Array.from(this.item.reduce((m, t) => m.set(t.name, t), new Map()).values());

Hope this works !!

answered Jan 03 '20 at 08:42

Akitha_MJ

3,882
25
20

score 2 · Answer 4 · answered May 08 '21 at 20:53

2

// user reduce method to remove duplicates from object array , very easily

  this.formulalist= this.formulalist.reduce((a, b) => {
      if (!a.find(data => data.name === b.name)) {
        a.push(b);
      }
      return a;
    }, []);

// o/p = in formulalist you will find only unique values

answered May 08 '21 at 20:53

Keyur Patel

59
1
5

Welcome to Stack Overflow. While this code may solve the question, [including an explanation](https://meta.stackoverflow.com/questions/392712/explaining-entirely-code-based-answers) of how and why this solves the problem would really help to improve the quality of your post, and probably result in more up-votes. Remember that you are answering the question for readers in the future, not just the person asking now. Please edit your answer to add explanations and give an indication of what limitations and assumptions apply. – Pawara Siriwardhane May 09 '21 at 03:46

quirimmo · Answer 5 · 2019-01-08T19:31:56.617

Use a reducer returning a new array of the unique objects:

const input = [{
    value: 'L7-LO',
    name: 'L7-LO'
  },
  {
    value: '%L7-LO',
    name: '%L7-LO'
  },
  {
    value: 'L7-LO',
    name: 'L7-LO'
  },
  {
    value: '%L7-LO',
    name: '%L7-LO'
  },
  {
    value: 'L7-L3',
    name: 'L7-L3'
  },
  {
    value: '%L7-L3',
    name: '%L7-L3'
  },
  {
    value: 'LO-L3',
    name: 'LO-L3'
  },
  {
    value: '%LO-L3',
    name: '%LO-L3'
  }
];
console.log(input.reduce((acc, val) => {
  if (!acc.find(el => el.value === val.value)) {
    acc.push(val);
  }
  return acc;
}, []));

Dasha Ermolova · Answer 6 · 2019-01-08T20:07:21.207

0

Filtering for unique values is much faster with assigning values to some object properties - there not will be duplicates. This approach gets better and better with every +1 member of initial array, because looping will be causing fast algorithm complications

let arr = [
  {value: 'L7-LO', name: 'L7-LO'},
  {value: '%L7-LO', name: '%L7-LO'},
  {value: 'L7-LO', name: 'L7-LO'},
  {value: '%L7-LO', name: '%L7-LO'},
  {value: 'L7-L3', name: 'L7-L3'},
  {value: '%L7-L3', name: '%L7-L3'},
  {value: 'LO-L3', name: 'LO-L3'},
  {value: '%LO-L3', name: '%LO-L3'}
];
let obj = {};

const unique = () => {
  let result = [];
  
  arr.forEach((item, i) => {
    obj[item['value']] = i;
  });
  
  for (let key in obj) {
    let index = obj[key];
    result.push(arr[index])
  }
  
  return result;
}

arr = unique(); // for example; 

console.log(arr);

edited Jan 08 '19 at 20:07

answered Jan 08 '19 at 19:28

Dasha Ermolova

484
4
6

Could you please update on How to reassign the result back to formula list. – Glory Raj Jan 08 '19 at 19:50
unique() - is a function, that returns a new array with "filtered" values from the initial one. But you have quite a large room for manoeuvre – Dasha Ermolova Jan 08 '19 at 20:11
the main idea is to 1) loop just once and store the array item and index in a key-value pair of some auxiliary object 2) after that you have no duplicates for sure, because object can't have 2 absolutely the same property names, it overrides the repeating ones – Dasha Ermolova Jan 08 '19 at 20:18

score 0 · Answer 7 · answered Jan 08 '19 at 19:55

if you are working using ES6 and up, basic JS using map and filter functions makes it easy.

var array = [{value:"a"},{value:"b"},{value:"c"},{value:"a"},{value:"c"},{value:"d"}];

console.log(array.filter((obj, pos, arr) => {
    return arr.map(mapObj => mapObj["value"]).indexOf(obj["value"]) === pos;
}));

Removing duplicates with in an object array using angular 4

7 Answers7