JavaScript get elements from an object array that are not in another

Question

I'm new in JavaScript programming and I have two object arrays that have the following structure:

myFirstObjArray = [{foo: 1, bar: 1}, {foo: 3, bar: 3}, {foo: 4, bar: 5}];
mySecondObjArray = [{foo: 2}, {foo: 4}, {foo: 5}];

I need to get two separate arrays containing the values of key foo, the first containing the ones that are in the first array but not in the second, based on the value of key foo, and the second that are in mySecondObjArray but not in myFirstObjArray.

Is there a way to do this without

for(i=0;i<myFirstObjArray.length;i++)
   for(j=0;j<mySecondObjArray .length;j++)
      {...build first array here}

for(i=0;i<mySecondObjArray .length;i++)
   for(j=0;j<myFirstObjArray.length;j++)
      {...build second array here}

? Perhaps my question is a duplicate one that I didn't find, so please be gentle.

Expected output:

firstArray = [{foo: 1}, {foo: 3}];
secondArray = [{foo: 2}, {foo: 5}];

@Dana: I added answer in ES5 to support all browsers including IE — Muthukumar Jayamurugan
– Muthukumar Jayamurugan, Commented Jun 13, 2018 at 12:22
Possible duplicate of How to get the difference between two arrays in Javascript? — Martijn
– Martijn, Commented Jun 13, 2018 at 13:40
In most languages this is called something along the lines of "array diff". — Martijn
– Martijn, Commented Jun 13, 2018 at 13:40

Muhammad Usman · Accepted Answer · 2018-06-15 09:49:46Z

25

You can simply filter one array's elements by setting the condition based on other array's elements like.

var myFirstObjArray = [{foo: 1, bar: 1}, {foo: 3, bar: 3}, {foo: 4, bar: 5}],
    mySecondObjArray = [{foo: 2}, {foo: 4}, {foo: 5}],
    
    firstArray  = myFirstObjArray.filter(o=> !mySecondObjArray.some(i=> i.foo === o.foo));
    
    secondArray  = mySecondObjArray.filter(o=> !myFirstObjArray.some(i=> i.foo === o.foo));
    
    console.log(firstArray.map(o=> {return {'foo' :  o.foo}}))
    console.log(secondArray.map(o=> {return {'foo' :  o.foo}}))

Ps:

The some() method tests whether at least one element in the array passes the test implemented by the provided function. And I've added a function which just checks if foo property exists in the other array with the same value to be able to filter from the first array.

At the end you can use .map to filter out the desired key value pairs

Hope that makes sense

Read more about .some and filter

edited Jun 15, 2018 at 9:49

answered Jun 13, 2018 at 12:11

Muhammad Usman

10.1k26 silver badges41 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

barbsan Over a year ago

First array should contain only foo properties, so OP propably needs to read about map too

Falco Over a year ago

Does not provide the expected output

Cuado Over a year ago

this helped me, thank you allRoles?.filter((r) => !userRoles?.some((ur) => ur.id === r.id)).map((role)

sjahan · Accepted Answer · 2018-06-13 12:15:54Z

10

Here is a small solution with just filter and a map with the foo attribute.

const myFirstObjArray = [{foo: 1, bar: 1}, {foo: 3, bar: 3}, {foo: 4, bar: 5}];
const mySecondObjArray = [{foo: 2}, {foo: 4}, {foo: 5}];

const exclude = (arr1, arr2) => arr1.filter(o1 => arr2.map(o2 => o2.foo).indexOf(o1.foo) === -1);

console.log(exclude(myFirstObjArray, mySecondObjArray));
console.log(exclude(mySecondObjArray, myFirstObjArray));

answered Jun 13, 2018 at 12:15

sjahan

5,9804 gold badges24 silver badges46 bronze badges

1 Comment

Benjamin Gruenbaum Over a year ago

Prefer includes to indefOf

Muthukumar Jayamurugan · Accepted Answer · 2018-06-13 12:20:39Z

2

ES5 without using fat arrow,

var myFirstObjArray = [{foo: 1, bar: 1}, {foo: 3, bar: 3}, {foo: 4, bar: 5}],
    mySecondObjArray = [{foo: 2}, {foo: 4}, {foo: 5}],
    
    firstArray  = myFirstObjArray.filter(function(o) { return !mySecondObjArray.some(function(i) { return i.foo === o.foo})});
     
    secondArray  = mySecondObjArray.filter(function(o) { return !myFirstObjArray.some(function(i) { return i.foo === o.foo})});
    
    console.log(firstArray)
    console.log(secondArray)

answered Jun 13, 2018 at 12:20

Muthukumar Jayamurugan

1,8352 gold badges17 silver badges34 bronze badges

Comments

Nina Scholz · Accepted Answer · 2018-06-13 12:12:50Z

1

You could filter by look up.

const unique = a => o => !a.some(({ foo }) => o.foo === foo);

var first = [{foo: 1, bar: 1}, {foo: 3, bar: 3}, {foo: 4, bar: 5}],
    second = [{foo: 2}, {foo: 4}, {foo: 5}],
    uniqueFirst = first.filter(unique(second)),
    uniqueSecond = second.filter(unique(first));
    
console.log(uniqueFirst);
console.log(uniqueSecond);

.as-console-wrapper { max-height: 100% !important; top: 0; }

answered Jun 13, 2018 at 12:12

Nina Scholz

388k26 gold badges367 silver badges417 bronze badges

Comments

Ankit Agarwal · Accepted Answer · 2018-06-13 12:15:17Z

You can create a reusable function to prevent code duplication. Just switch over to the function parameter. Also note that the inner loop is simple for loop so that we can use break and avoid unnecessary checks.

var firstArray = [];
var secondArray = [];
var myFirstObjArray = [{foo: 1, bar: 1}, {foo: 3, bar: 3}, {foo: 4, bar: 5}];
var mySecondObjArray = [{foo: 2}, {foo: 4}, {foo: 5}];

function difference(myFirstObjArray, mySecondObjArray){
  var firstArray = [];
  myFirstObjArray.forEach((obj)=>{
   var match = false;
   for(var i=0; i<mySecondObjArray.length; i++){
     var secondObj = mySecondObjArray[i];
     if(obj.foo === secondObj.foo){
       match = true;
       break;
     }
   }
   if(!match){
     firstArray.push({'foo': obj.foo});
   }
  });
  return firstArray;
}


console.log(difference(myFirstObjArray, mySecondObjArray));

console.log(difference(mySecondObjArray, myFirstObjArray));

Collectives™ on Stack Overflow

JavaScript get elements from an object array that are not in another

5 Answers 5

3 Comments

1 Comment

Comments

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

5 Answers 5

3 Comments

1 Comment

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related