Javascript JSON comparison/diff?

Question

Say I have the following 2 json objects:

JSON A:
{
"Field A":"1",
"Field B":"2",
"Field D":"Something",
"Field E":"6"
}

JSON B:
{
"Field A":"1",
"Field B":"2",
"Field C":"3",
"Field D":"Different"
}

Sample Function: function (jsonstringA, jsonstringB)

Example (If JSON A and JSON B used as parameters):

Returns a new JSON object containing:

{
"Field C":"3", // because function sees jsonstringB had no "Field C"
"Field D": "Different" // sees jsonstringB had a different value for "Field D"
}

Note that it is using jsonstringA as the base of the comparison, so the function returns only the fields missing and values of jsonStringB. That is why "Field E" and its value is not returned.

What is the best way if possible to come up with a function that returns a json object containing values that have changed?

WHAT I HAVE TRIED: I have tried doing a comparison by manually specifying the fields that I am trying to check for, but I would like to have something that requires me to not hardcode the "Fields" as it is very inefficient and everytime I add a new field to JSON B, I have to hardcode in the field I am looking for... that is why I am looking for something less of a pain.

You can base something on the code in this answer: http://stackoverflow.com/a/1144249/562906 — sinelaw, Apr 27 '12 at 21:10

score 24 · Accepted Answer · answered Apr 27 '12 at 21:10

24

It's not too hard to create a function like this. Just loop through each field in the second object, and if it's not present in the first or the value is different than the first, put that field in the return object.

var compareJSON = function(obj1, obj2) {
  var ret = {};
  for(var i in obj2) {
    if(!obj1.hasOwnProperty(i) || obj2[i] !== obj1[i]) {
      ret[i] = obj2[i];
    }
  }
  return ret;
};

You can see it in action on this demo page.

answered Apr 27 '12 at 21:10

Peter Olson

139,199
49
202
242

Ah, ignore my comment, i assumed he also wanted a diff for variable number of properties for objects a and b. But it seems both objects have the same number of properties. – aziz punjani Apr 27 '12 at 21:21
3

The OP probably would want to recurse into object and array values. – Phrogz Apr 27 '12 at 21:22
@Phrogz I'm not sure, from his description and example it seems like a shallow comparison is sufficient. – Peter Olson Apr 27 '12 at 21:23
1

It would be nice if it could recurse through array values as I am curious about that, but a shallow recurse is sufficient. Thanks, you have helped save me from my hardcoded mess at least up until I end up having to deal with arrays. – Rolando Apr 27 '12 at 22:02

score 4 · Answer 2 · answered Apr 27 '12 at 21:12

4

You can have a look at json diff wrapper here

It has also demo page.You can use this wrapper.

answered Apr 27 '12 at 21:12

Hüseyin BABAL

15,400
4
51
73

score 4 · Answer 3 · edited May 23 '17 at 11:53

4

The function, just what i was after is also useful for non - JSON object comparison

http://jsfiddle.net/muJEu/11/

Also extended it for deep nested objects.

isEmpty

can be done in many ways. see Is object empty?

var compareObj = function(obj1, obj2) { 
  var ret = {},rett; 
  for(var i in obj2) { 
      rett = {};  
      if (typeof obj2[i] === 'object'){
          rett = compareObj (obj1[i], obj2[i]) ;
          if (!isEmpty(rett) ){
           ret[i]= rett
          }              
       }else{
           if(!obj1 || !obj1.hasOwnProperty(i) || obj2[i] !== obj1[i]) { 
              ret[i] = obj2[i]; 
      } 
   }
  } 
  return ret; 
};

edited May 23 '17 at 11:53

Community

1
1

answered Nov 15 '12 at 00:46

Steve Black

609
5
9

1

This fails if a value is an array, because `typeof [] === 'object'` – SimplGy Mar 01 '14 at 00:34
1

This doesn't perform as expected if a property exists in `obj1` but not in `obj2`. eg: `a={a:true}` `b={b:true}`. `compareObj(a,b) // returns {b:true}. you might expect {a:true,b:true}` – SimplGy Mar 01 '14 at 00:35
Where is `rett` defined, or is it a global variable? – Vitani Apr 01 '16 at 08:37
rett is defined in line 2. var ret= {}, rett; – Steve Black Apr 10 '16 at 23:52

score 1 · Answer 4 · answered May 16 '19 at 06:44

In the Peter Olson answer, it will not check for array values, to overcome from that issue, I have modified the solution like this.

var compareJSON = function(obj1, obj2) { 
      var ret = {}; 
      for(var i in obj2) { 
        if(!obj1.hasOwnProperty(i) || obj2[i] !== obj1[i]) {
          if(!Array.isArray(obj2[i]) || !(JSON.stringify(obj2[i]) == JSON.stringify(obj1[i]))){
          ret[i] = obj2[i];
          }
        } 
      } 
      return ret; 
    };

Javascript JSON comparison/diff?

4 Answers4

Linked

Related