javascript - How can I remove duplicates elements between 2 arrays in angular? - Stack Overflow

admin管理员组

文章数量:1323715

Say I have

arr1 = ["Tom","Harry","Patrick"]

arr2 = ["Miguel","Harry","Patrick","Felipe","Mario","Tom"]

How can I remove the duplicate elements in arrays?

I want this output

arr2 = ["Miguel","Felipe","Mario"]

Say I have

arr1 = ["Tom","Harry","Patrick"]

arr2 = ["Miguel","Harry","Patrick","Felipe","Mario","Tom"]

How can I remove the duplicate elements in arrays?

I want this output

arr2 = ["Miguel","Felipe","Mario"]

• javascript
• arrays
• angular
• typescript
• angular5

Share Improve this question Follow edited Sep 7, 2018 at 21:27 Emeeus 5,26022 gold badges2727 silver badges3939 bronze badges asked Sep 5, 2018 at 22:26 User100696User100696 70744 gold badges1414 silver badges2626 bronze badges 3

• Please paste your code what you have tried. – samnu pel Commented Sep 5, 2018 at 22:28
• Possible duplicate of Get all unique values in a JavaScript array (remove duplicates) – imans77 Commented Sep 5, 2018 at 22:29
• Possible duplicate of Merge two arrays – lietutis Commented Sep 5, 2018 at 22:30

Add a ment  | 

9 Answers 9

Sorted by: Reset to default 3

Use filter bined with includes. Example:

let arr1 = ["Tom","Harry","Patrick"]
let arr2 = ["Miguel","Harry","Patrick","Felipe","Mario","Tom"]
arr2 = arr2.filter(x=>!arr1.includes(x))
console.log(arr2)

I think that the best way will be to use filter() array method, iterate through the target array (it's arr2 in this case), and exclude duplicates via !arr1.includes(currentItem). This construction lets you know, does arr1 contain current item of iteration:

const arr1 = ["Tom","Harry","Patrick"];
const arr2 = ["Miguel","Harry","Patrick","Felipe","Mario","Tom"];

const result = arr2.filter(d => !arr1.includes(d));
console.log(result);

If you have lodash, you can use the difference function directly.

_.difference(arr2, arr1) will give the required output.

Edit: JSFiddle URL: https://jsfiddle/k3ynjq1m/3/

Using includes() is better because returns true or false, but unfortunately it is not supported by IE, see this. In case you want this working on IE too, you should use indexOf().

var arr1 = ["Tom","Harry","Patrick"]

var arr2 = ["Miguel","Harry","Patrick","Felipe","Mario","Tom"]

arr2 = arr2.filter(e=>arr1.indexOf(e)<0)

console.log(arr2)

And filter is better because:

The filter() method creates a new array with all elements that pass the test implemented by the provided function.

Using regular js, you can use a nested for loop:

for (var i in arr2) {
  var duplicate = false;
  for (var i2 in arr1) {
    if (arr2[i] == arr1.[i2]) {
      duplicate = true;
    }
  }
  if (duplicate) {
    arr2.splice(i, 1);
  }
}

I think you should keep a map and add elements to that map.

if element exists in map, then that is duplicate else add it to map.

The way you can store your duplicates is storing their value in another list. That is up to you.

Once you know your duplicates, duplicate it from the list.

This is O(n) plexity, and O(n) space plexity.

for(var i = 0 ; i<this.arr1.length; i++) {
    for(var j = 0 ; j<this.arr2.length; j++) {
        if(this.arr1[i] === this.arr2[j]) {
            this.arr1.splice(i, 1);
            this.arr2.splice(j, 1);
                i--;
                j--;
        }
    }
}    
this.arr2 = this.arr1.concat(this.arr2);
console.log(this.arr2)

here's a working code (your exemple): https://stackblitz./edit/angular-yzte87

So the way I see it there are multiple ways to achieve what you're looking for,

1. Using filter and include like some mentioned above me - It will work but I don't know how efficient that will be as you are using filter to iterate on arr2 and then for each element you iterate on arr1 to see if there's matching case, I don't know how familiar you are with algorithm analysis but it's O(N power 2) which is not very time efficient, means quickly as arr1 or arr2 will grow it will take much longer for your function to run, if you do go with that option please use sort() first so you might save time and be more efficient.

See Example:

  let namesToRemove = ["Tom", "Harry", "Patrick"].sort()
  let names = ["Miguel", "Harry", "Patrick", "Felipe", "Mario", "Tom"].sort()

  let lastNameToRemove = namesToRemove[namesToRemove.length - 1]

  names = names.filter((name) => {
    if (name[0] > lastNameToRemove[0]) {
      return true
    }

    return !namesToRemove.includes(name)
  })

  console.log(names)

Keep in mind that if you will use for loop and splice() you can just break and it will be even more efficient.

2. Using Map - You can iterate once on your first array and create a map in JS which is just using an object notation and once on your names array and check if there is a match, you can improve that using sort() and other improvement but the idea is, see below example.

See Example:

  let namesToRemove = ["Tom", "Harry", "Patrick"]
  let names = ["Miguel", "Harry", "Patrick", "Felipe", "Mario", "Tom"]

  let namesToRemoveMap = {}

  for (name of namesToRemove) {
    namesToRemoveMap[name] = true
  }

  names = names.filter((name) => !namesToRemoveMap[name])

  console.log(names)

Of course either way you choose I would include some more defensive checks, like if the arrays have value in them etc...

Hope I could explain myself clear, let me know if you need more help or if you have any question.

So you want to remove elements from an array (if they exist) based from another array. Ok, let see... I have a ponent that implement a function with a similar logic:

let criteriaArr = ["Tom", "Harry", "Patrick"];
let arrToFilter = ["Miguel","Harry","Patrick","Felipe","Mario","Tom"];

let filteredArray = arrToFilter.filter(e => criteriaArr.indexOf(e) < 0);

console.log(filteredArray);

So what filter does is: Returns the elements of an array that meet the condition specified in a callback function.

what the callback function does is: for each element from arrToFilter, if that element does not exit in criteriaArr then keep it otherwise go to the next element.

Here is the function:

removeElems(arrToFilter: Array<any>): Array<any> {
  let filteredArray = arrToFilter.filter(e => this._criteriaArr.indexOf(e) < 0);
  return filteredArray;
}

this._criteriaArr is a private property with default value: private _criteriaArr = ["Tom","Harry","Patrick"]

Or, you can do it this way:

removeElems(arrToFilter: Array<any>, criteriaArr: Array<any>): Array<any> {
  let filteredArray = arrToFilter.filter(e => criteriaArr.indexOf(e) < 0);
  return filteredArray;
}

handle it with two array.

have fun ! :)

本文标签： javascriptHow can I remove duplicates elements between 2 arrays in angularStack Overflow