I was looking at the JavaScript console in Chrome and noticed something strange, even though they appear the same, obj and JSON.parse(JSON.stringify(obj)) are not the same. Why is that?
var obj = {test:'this is a test', another: {omg:'ay dios mio', check:true}};
console.log(obj, JSON.parse(JSON.stringify(obj)));
console.log(obj == JSON.parse(JSON.stringify(obj)));
They look identical but return false when you check equality. Why is that?
They're not equal for the same reason this returns false:
({omg:'ay dios mio', check:true}) == ({omg:'ay dios mio', check:true})
You're not comparing the values inside the object, but the object references. They'll be different.
The objects are testing for REFERENCES.
While primitives are testing for VALUE.
Because the obj does not reference the parsed object in memory. So these are 2 different declarations. If you do this:
var a = [ 10 ],
b = [ 10 ];
Then there are 2 instances of arrays with the same values, but that doesn't make them the same array. So a != b, even though 10 == 10. You can increase the value of a[0] to 15, but that doesn't change the value of b[0] to 15.
Therefore, if you want to compare objects, you have to loop through them and check if the values of the objects are the same.
A function to compare (borrowed from jQuery object equality )
$.fn.equals = function(compareTo) {
if (!compareTo || this.length != compareTo.length) {
return false;
}
for (var i = 0; i < this.length; ++i) {
if (this[i] !== compareTo[i]) {
return false;
}
}
return true;
};
JSON.stringify()then you'll see their values are equal.[...]If both operands are objects, then JavaScript compares internal references which are equal when operands refer to the same object in memory.