Compare two JSON objects and just return another JSON object with only the changes

Question

I am new to JavaScript and trying to find the difference between two JSON Objects. The structure of the JSON object and its data is shown below. I got a code online which works for a normal JSON object but as this also has an array of data, I think it doesnt work for that. I tried different things but to no result. If you have pointers for this, it would be greatly appreciated. Thanks.

JSON Object 1(obj1) : {id: 1, details: Array[2], profession: "Business"}

{
  "id": "1",
  "details": [{
      "name": "Peter",
      "address": "Arizona",
      "phone": 9900998899
    },
    {
      "name": "Jam",
      "address": "Kentucky",
      "phone": 56034033343
    }
  ],
  "profession": "Business"
}

JSON Object 2(obj2) : {id: 2, details: Array[2], profession: "Business"}

{
  "id": "2",
  "details": [{
      "name": "Peter",
      "address": "Arizona",
      "phone": 9900998899
    },
    {
      "name": "David",
      "address": "Boston",
      "phone": 434323434
    }
  ],
  "profession": "Business"
}

Solution:

compare(obj1, obj2) {

  var result = {};

  for (key in obj1) {
    if (obj2[key] != obj1[key]) {
      result[key] = obj2[key];
    }
    if (typeof obj2[key] === '[object Array]' && typeof obj1[key] === '[object Array]') {
      result[key] = compare(obj1[key], obj2[key]);
    }
    if (typeof obj2[key] === 'object' && typeof obj1[key] === 'object') {
      result[key] = compare(obj1[key], obj2[key]);
    }
  }
  console.log(result);
}

Result:

Object {0: undefined, 1: undefined}
Object {id: "2", pingedAddresses: undefined, type: "Business"}

Expected:

{
  "id": "2",
  "details": [{
    "name": "David",
    "address": "Boston",
    "phone": 434323434
  }]
}

[There's no such thing as a "JSON Object"](http://benalman.com/news/2010/03/theres-no-such-thing-as-a-json/) — Andreas, Feb 28 '17 at 06:07
You will never get `[object Array]` as type. To get that, you will have to do `Object.prototype.toString.apply(obj)`. Also if you wish to check array, use `Array.isArray` — Rajesh, Feb 28 '17 at 06:08
consider using underscore (or any other library you prefer) if you can, no need to invent the wheel unless your task is to invent it — Tebe, Feb 28 '17 at 06:16
can you give an example of what that new object would look like — Jonathan Portorreal, Feb 28 '17 at 06:17
@JonathanPortorreal editted the question and added the expected output — Goutam, Feb 28 '17 at 06:23
What if Peter and David had swapped positions, and why is Jam not considered a difference? — trincot, Feb 28 '17 at 06:27
look into using this library https://github.com/srcagency/object-diff — Jonathan Portorreal, Feb 28 '17 at 06:34
Already answered here: http://stackoverflow.com/questions/201183/how-to-determine-equality-for-two-javascript-objects — Shreyansh Gandhi, Feb 28 '17 at 10:01

score 9 · Accepted Answer · edited May 23 '17 at 12:17

You can try following as a simple comparison:

Note: This answer assumes the structure to be exactly same. You can take this as reference and make it more generic for cases where structures are different.

Points to consider:

Number of items are different. o1.details have 2 entries and o2.details have say 5 entries.
Object structure is different. Properties in both object are different.

function getDifference(o1, o2) {
  var diff = {};
  var tmp = null;
  if (JSON.stringify(o1) === JSON.stringify(o2)) return;

  for (var k in o1) {
    if (Array.isArray(o1[k]) && Array.isArray(o2[k])) {
      tmp = o1[k].reduce(function(p, c, i) {
        var _t = getDifference(c, o2[k][i]);
        if (_t)
          p.push(_t);
        return p;
      }, []);
      if (Object.keys(tmp).length > 0)
        diff[k] = tmp;
    } else if (typeof(o1[k]) === "object" && typeof(o2[k]) === "object") {
      tmp = getDifference(o1[k], o2[k]);
      if (tmp && Object.keys(tmp) > 0)
        diff[k] = tmp;
    } else if (o1[k] !== o2[k]) {
      diff[k] = o2[k]
    }
  }
  return diff;
}

var o1={id:"1",details:[{name:"Peter",address:"Arizona",phone:9900998899},{name:"Jam",address:"Kentucky",phone:56034033343}],profession:"Business"},
o2={id:"2",details:[{name:"Peter",address:"Arizona",phone:9900998899},{name:"David",address:"Boston",phone:434323434}],profession:"Business"};

var d = getDifference(o1, o2)
console.log(d)

I had written an answer to detect changes in objects. You can even take reference from this as well.

score 0 · Answer 2 · answered Feb 28 '17 at 06:13

0

You need to run a for loop over the first object and check whether the second one has it or not. Then save it to a new third object:

 var obj3={};
 for (var key in obj1)
 {
    !obj2.hasOwnProperty(key) && obj3[key]=obj[key];

 }

answered Feb 28 '17 at 06:13

Amir H. Bagheri

1,416
1
9
17

1

Don't forget that obj2 must have more members than obj1. – Amir H. Bagheri Feb 28 '17 at 06:15

Compare two JSON objects and just return another JSON object with only the changes

2 Answers2