A small library that can deep diff two JavaScript Objects, including nested structures of arrays and objects.
yarn add https://github.com/sanukerinc/deep-object-diff.git
-
diff(originalObj, updatedObj)returns the difference of the original and updated objects -
addedDiff(original, updatedObj)returns only the values added to the updated object -
deletedDiff(original, updatedObj)returns only the values deleted in the updated object -
updatedDiff(original, updatedObj)returns only the values that have been changed in the updated object -
detailedDiff(original, updatedObj)returns an object with the added, deleted and updated differences
ES6 / Babel:
import { diff, addedDiff, deletedDiff, updatedDiff, detailedDiff } from 'deep-object-diff';ES5:
const { diff, addedDiff, deletedDiff, detailedDiff, updatedDiff } = require("deep-object-diff"); // OR const diff = require("deep-object-diff").diff; const addedDiff = require("deep-object-diff").addedDiff; const deletedDiff = require("deep-object-diff").deletedDiff; const detailedDiff = require("deep-object-diff").detailedDiff; const updatedDiff = require("deep-object-diff").updatedDiff;const lhs = { foo: { bar: { a: ['a', 'b'], b: 2, c: ['x', 'y'], e: 100 // deleted } }, buzz: 'world' }; const rhs = { foo: { bar: { a: ['a'], // index 1 ('b') deleted b: 2, // unchanged c: ['x', 'y', 'z'], // 'z' added d: 'Hello, world!' // added } }, buzz: 'fizz' // updated }; console.log(diff(lhs, rhs)); // => /* { foo: { bar: { a: { '1': undefined }, c: { '2': 'z' }, d: 'Hello, world!', e: undefined } }, buzz: 'fizz' } */const lhs = { foo: { bar: { a: ['a', 'b'], b: 2, c: ['x', 'y'], e: 100 // deleted } }, buzz: 'world' }; const rhs = { foo: { bar: { a: ['a'], // index 1 ('b') deleted b: 2, // unchanged c: ['x', 'y', 'z'], // 'z' added d: 'Hello, world!' // added } }, buzz: 'fizz' // updated }; console.log(addedDiff(lhs, rhs)); /* { foo: { bar: { c: { '2': { after: 'z' } }, d: { after: 'Hello, world!' } } } } */const lhs = { foo: { bar: { a: ['a', 'b'], b: 2, c: ['x', 'y'], e: 100 // deleted } }, buzz: 'world' }; const rhs = { foo: { bar: { a: ['a'], // index 1 ('b') deleted b: 2, // unchanged c: ['x', 'y', 'z'], // 'z' added d: 'Hello, world!' // added } }, buzz: 'fizz' // updated }; console.log(deletedDiff(lhs, rhs)); /* { foo: { bar: { a: { '1': { before: 'b' } }, e: { before: 'Hello, world!' } } } } */const lhs = { foo: { bar: { a: ['a', 'b'], b: 2, c: ['x', 'y'], e: 100 // deleted } }, buzz: 'world' }; const rhs = { foo: { bar: { a: ['a'], // index 1 ('b') deleted b: 2, // unchanged c: ['x', 'y', 'z'], // 'z' added d: 'Hello, world!' // added } }, buzz: 'fizz' // updated }; console.log(updatedDiff(lhs, rhs)); /* { buzz: { before: 'world' after: 'fizz' } } */const lhs = { foo: { bar: { a: ['a', 'b'], b: 2, c: ['x', 'y'], e: 100 // deleted } }, buzz: 'world' }; const rhs = { foo: { bar: { a: ['a'], // index 1 ('b') deleted b: 2, // unchanged c: ['x', 'y', 'z'], // 'z' added d: 'Hello, world!' // added } }, buzz: 'fizz' // updated }; console.log(detailedDiff(lhs, rhs)); /* { added: { foo: { bar: { c: { '2': { after: 'z' } }, d: { after: 'Hello, world!' } } } }, deleted: { foo: { bar: { a: { '1': { before: 'b' } }, e: { before: 100 } } } }, updated: { buzz: { before: 'world' after: 'fizz' } } } */MIT
