Angular - Compare two arrays with same number of objects but with different values and return the difference from second array

Question

I have 2 array of objects

arrayOne = [{objectType: 'License', objectId: 333, objectName: 'Test Object 1', dataType: 'String'}
        {objectType: 'Owner', objectId: 334, objectName: 'Test Object 2', dataType: 'String'},
        {objectType: 'Location', objectId: 335, objectName: 'Test Object 3', dataType: 'String'}]
        
arrayTwo = [{objectType: 'LICENSE', objectId: 333, objectName: 'Test Object 1', dataType: 'String'}
        {objectType: 'OWNER', objectId: 334, objectName: 'Test Object 4', dataType: 'Value List'},
        {objectType: 'LOCATION', objectId: 335, objectName: 'Test Object 3', dataType: 'String'}]

As we can see in arrayTwo, objectName and dataType is changed. It may be possible any of the property might change but the number of objects will be always same on both arrays.

So here, I need to pull the objects from arrayTwo which has been changed by comparing with arrayOne and store it in a new array say resultsArray?

I checked the answers provided in How to get the difference between two arrays of objects in JavaScript it only talks about getting the differences based on one property, not any property. Please suggest on this. Thanks.

EDIT: Edited arrayTwo to have capital letters for objectType. I need to ignore the case and result should be case insensitive. Thanks

Babis.amas · Accepted Answer · 2021-12-09 11:46:23Z

1

One option is to iterate through the first array elements, find the same element for the second array by its id and then check if any of its properties have changed:

arrayOne = [{
    objectType: 'License',
    objectId: 333,
    objectName: 'Test Object 1',
    dataType: 'String'
  }, {
    objectType: 'Owner',
    objectId: 334,
    objectName: 'Test Object 2',
    dataType: 'String'
  },
  {
    objectType: 'Location',
    objectId: 335,
    objectName: 'Test Object 3',
    dataType: 'String'
  }
]

arrayTwo = [{
    objectType: 'License',
    objectId: 333,
    objectName: 'Test Object 1',
    dataType: 'String'
  }, {
    objectType: 'Owner',
    objectId: 334,
    objectName: 'Test Object 4',
    dataType: 'Value List'
  },
  {
    objectType: 'Location',
    objectId: 335,
    objectName: 'Test Object 3',
    dataType: 'String'
  }
];

const changedObjects = arrayOne.filter(obj1 => {
  const obj2 = arrayTwo.find(x => x.objectId === obj1.objectId);
  return Object.keys(obj1).some(key => String(obj1[key]).toLowerCase() !== String(obj2[key]).toLowerCase());
});

console.log(changedObjects);

EDIT: The above example will return the element from the arrayOne. In case you need the element with the new values you can reverse arrayOne and arrayTwo inside the function.

edited Dec 9, 2021 at 11:46

answered Dec 9, 2021 at 10:00

Babis.amas

4713 silver badges16 bronze badges

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

3 Comments

vamsi Over a year ago

Thanks for the response, in this example can I check with case insensitive manner for string values? For ex, on one array objectName is Owner and in 2nd array it is OWNER. In this case, I should ignore it.

Babis.amas Over a year ago

@vamsi you just have to add .toLowerCase() after the 2 values you are comparing so that they both transform to "owner" which are equal. Notice that I also used the String() around the value because some of your object values are numbers where .toLowerCase() can't be apply.

Babis.amas Over a year ago

@vamsi Forgot to mention that I edited my answer. If that covers your requirements make sure to upvote and accept it :)

Collectives™ on Stack Overflow

Angular - Compare two arrays with same number of objects but with different values and return the difference from second array

1 Answer 1

3 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related