Object Equality in JavaScript

It’s really easy to compare number or strings but did you try comparing two objects ?

Even if two object has same key and value pair it will return false.

example:

let name = {
firstName: “suprabha”,
lastName: “supi”
}

let fullName = {

It’s really easy to compare number or strings but did you try comparing two objects ?

Even if two object has same key and value pair it will return false.

example:

let name = {
    firstName: "suprabha",
    lastName: "supi"
}

let fullName = {
    firstName: "suprabha",
    lastName: "supi"
}

console.log(name === name) // true
console.log(name === fullName) // false
console.log(name == fullName) // false

console.log(Object.is(name, fullName)) // false
console.log(Object.is(name, name)) // true

As you can see above example, both name and fullName are identical. Yet, the object are not equal either with == or ===.



There are two things you can check while doing object equality:

1️⃣ Objects has same instance

2️⃣ Objects has same value



1️⃣ Objects has same instance

JavaScript has two approaches to match the values.

  • For Primitive Type(string, numbers), it compare by their values.
  • For Non-Primitive Type(object, array, date), it compare by their reference.



What does it mean by compare by their reference?

Comparing by reference means object refers to the same location in memory.

example:

let name = {
    firstName: "suprabha",
    lastName: "supi"
}

let fullName = {
    firstName: "suprabha",
    lastName: "supi"
}

let copyName = fullName

console.log(name === fullName) // false
console.log(copyName == fullName) // true

Here, copyName and fullName are referring to the same instance of memory and hence returning true.



2️⃣ Objects has same value

To check the instance you can use === equality, but to match the value you need to work more ?

let name = {
    firstName: "suprabha",
    lastName: "supi"
}

let fullName = {
    firstName: "suprabha",
    lastName: "supi"
}

function isEqual(obj1, obj2) {
    var props1 = Object.getOwnPropertyNames(obj1);
    var props2 = Object.getOwnPropertyNames(obj2);

    if (props1.length != props2.length) {
        return false;
    }

    for (var i = 0; i < props1.length; i++) {
        let val1 = obj1[props1[i]];
        let val2 = obj2[props1[i]];
        let isObjects = isObject(val1) && isObject(val2);

        if (isObjects && !isEqual(val1, val2) || !isObjects && val1 !== val2) {
            return false;
        }
    }
    return true;
}

function isObject(object) {
  return object != null && typeof object === 'object';
}

console.log(isEqual(name, fullName)); // true

There are few plugins which helps you in terms of the above condition where you can simply use _.isEqual to check the object values:

  1. UnderScore
  2. Lodash
  3. isDeepStrictEqual(object1, object2) Node
let name = {
    firstName: "suprabha",
    lastName: "supi"
}

let fullName = {
    firstName: "suprabha",
    lastName: "supi"
}

console.log(_.isEqual(name, fullName)); // true



Summary ⅀

In object, if you do instance check for two objects then you can use ==, === and Object.is() .

However if you want to check for two object value, then you have to write your own logic to do it.

Thanks for reading the article ❤️

Buy Me A Coffee


Print Share Comment Cite Upload Translate
APA
Suprabha | Sciencx (2024-03-28T10:08:27+00:00) » Object Equality in JavaScript. Retrieved from https://www.scien.cx/2021/08/14/object-equality-in-javascript/.
MLA
" » Object Equality in JavaScript." Suprabha | Sciencx - Saturday August 14, 2021, https://www.scien.cx/2021/08/14/object-equality-in-javascript/
HARVARD
Suprabha | Sciencx Saturday August 14, 2021 » Object Equality in JavaScript., viewed 2024-03-28T10:08:27+00:00,<https://www.scien.cx/2021/08/14/object-equality-in-javascript/>
VANCOUVER
Suprabha | Sciencx - » Object Equality in JavaScript. [Internet]. [Accessed 2024-03-28T10:08:27+00:00]. Available from: https://www.scien.cx/2021/08/14/object-equality-in-javascript/
CHICAGO
" » Object Equality in JavaScript." Suprabha | Sciencx - Accessed 2024-03-28T10:08:27+00:00. https://www.scien.cx/2021/08/14/object-equality-in-javascript/
IEEE
" » Object Equality in JavaScript." Suprabha | Sciencx [Online]. Available: https://www.scien.cx/2021/08/14/object-equality-in-javascript/. [Accessed: 2024-03-28T10:08:27+00:00]
rf:citation
» Object Equality in JavaScript | Suprabha | Sciencx | https://www.scien.cx/2021/08/14/object-equality-in-javascript/ | 2024-03-28T10:08:27+00:00
https://github.com/addpipe/simple-recorderjs-demo