Update Javascript Object only if there is a change

Question

I have a javascript object on my DB, its personal data, this is the structure:

const storedUserData = {
      name: "John",
      sirname:"Doe",
      phone: "666-666-66666",
      streetName: "Fake Street",
      streetNumber: "123",
      zipCode: "90125"
}

and I have a separate object, which has the same structure, which basically is on the front end, and its the result of reading form data.

const formData = {
      name: "John",
      sirname:"Doe",
      phone: "666-666-66666",
      streetName: "Fake Street",
      streetNumber: "123",
      zipCode: "90125"
}

Basically, when the user clicks submit I want to check if there are differences between the stored object storedUserData, above, and the new object, formData. If there are differences, save the differences to the DB.

Of course, I could go on like this for each property, since there are few:

if(storedUserData.name !== formData.name) {
   pushDataToDb()
}

but its the lazy approach, and I want to do it correctly. I've been reading into object keys, but I cant figure it out. How could I successfully loop between each property of both items comparing them, and then only if there is a change between the two properties I would push to DB.

Thank you.

if the property order for both is the same, you could just use `if(JSON.stringify(obj1) === JSON.stringify(obj2))`... — Zer0, Aug 11 '20 at 13:16
Thank you both, @DaneBrouwer, interesting read. Cleared up a lot of things. Suggested lodash. — Martin Ch, Aug 11 '20 at 13:17
@Zer0 great! Had not thought about that. Yes order is always the same. Thanks — Martin Ch, Aug 11 '20 at 13:18
@MartinCh the stringify methode works but.... you need to sort your object keys like this `JSON.stringify(obj1, Object.keys(obj1).sort())` same for your obj2. because `{ name: "max", age: 22 }` is not same like `{ age: 22, name: "max" }` if you stringify it. thats why you need to sort it aswell — bill.gates, Aug 11 '20 at 13:22
@Ifaruki why would I have to sort them if they are always the same? — Martin Ch, Aug 11 '20 at 13:23
well after reading this https://stackoverflow.com/questions/5525795/does-javascript-guarantee-object-property-order#:~:text=An%20object%20is%20an%20unordered,can't%20guarantee%20the%20order. i would just sort the keys in addition to be sure — bill.gates, Aug 11 '20 at 13:25

score 2 · Accepted Answer · answered Aug 11 '20 at 13:26

You could use a loop as you mentioned above,

function isEquivalent(a, b) {
    // Create arrays of property names
    var aProps = Object.getOwnPropertyNames(a);
    var bProps = Object.getOwnPropertyNames(b);

    // If number of properties is different,
    // objects are not equivalent
    if (aProps.length != bProps.length) {
        return false;
    }

    for (var i = 0; i < aProps.length; i++) {
        var propName = aProps[i];

        // If values of same property are not equal,
        // objects are not equivalent
        if (a[propName] !== b[propName]) {
            return false;
        }
    }

    // If we made it this far, objects
    // are considered equivalent
    return true;
}

Update Javascript Object only if there is a change

1 Answers1