JavaScript or AngularJS: Find two objects with matching properties values

Question

I am sure this question will have be asked before but for some reason i can't find the right way to find the answer I'm after.

I have two lists of objects. The objects are slightly different but both have a 'ref' property that i can compare them with. I basically want a new list of objects that contains only the objects that are in list1 with a ref value that does not equal any of the ref values for objects in list2.

Currently this is the method I use. This does work. However I know that this is probably very inefficient since I am using two loops and looping through the second one countless times. So I'm wondering what the 'proper' method of doing this would be.

var add;
for (var x = 0; x < availableQuestions.length; x++) {
    add = true;
    for (var j = 0; j < currentQuestions.length; j++) {
        if (availableQuestions[x].Ref == currentQuestions[j].Ref) {
            add = false;
        }
    }
    if (add) {
        $scope.Questions.push(availableQuestions[x])
    }
}

Answer 1

Create array of ref in current questions which would only require iterating that array once.

Then filter the other array comparing to the array of Ref

var currentRef = currentQuestions.map(function(item){
     return item.Ref;
});

$scope.Questions = availableQuestions.filter(function(item){
     return currentRef.indexOf(item.Ref) === -1;
});

Or even faster would be a hashmap object where item.Ref are the property names

var currentRef = currentQuestions.reduce(function(obj,item){
         obj[item.Ref] = true;
         return obj;
},{});

$scope.Questions = availableQuestions.filter(function(item){
         return !currentRef[item.Ref];
});

Note: all of these methods return new arrays and therefore are not destructive to original arrays

Answer 2

Try this :

for (var x = 0; x < availableQuestions.length; x++) {
    for (var j = 0; j < currentQuestions.length; j++) {
        if (availableQuestions[x].Ref == currentQuestions[j].Ref) {
            $scope.Questions.push(availableQuestions[x]);
        }
    }
}

Answer 3

If you have access to Set, you could do something like:

var s = new Set(currentQuestions.map(function(q) { return q.Ref }));
availableQuestions.forEach(function(q){
   if(!s.has(q.Ref)){
      $scope.Questions.push(q);
   }
});

This assuming that aq.Ref === cq.Ref

Answer 4

Convert both of your arrays to associative arrays and then you can do one pass to get the unmatched:

var avail = new Array();
var curr = new Array();
angular.forEach(availableQuestions, function(q){
    avail[q.Ref] = q;
});
angular.forEach(currentQuestions, function(q){
    curr[q.Ref] = q;
});
angular.forEach(avail, function(a){
    var q = curr[a.Ref];
    if (q !== null) {
        $scope.Questions.push(a);
    }
});