Array indexOf checking for object equality

Question

I've got a problem on Javascript.

var reponseValide1 = [{
  title: "test"
}, {
  text: "test"
}];
var reponseValide2 = [{
  title: "test"
}];
console.log(reponseValide1.indexOf(reponseValide2[0]));

The above code logs false. I don't understand why. reponseValide2 does contain the same object, with same variables and types. Can you help me understand why, please?

it may return `-1` instead of `false`. it does not look for the same object reference. it looks for another object. — Nina Scholz, Oct 29 '18 at 11:09
_""reponseValide2" does contain the same object"_ - no, it doesn't. _"with same variables and type"_ - that doesn't make it the same object. indexOf uses strict comparison, https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Comparison_Operators#Using_the_Equality_Operators — misorude, Oct 29 '18 at 11:10
Do we have a canonical answer for `Why does array.find({prop: "value"}) doesn't get {prop: "value"}` type of questions? — VLAZ, Oct 29 '18 at 11:12
One object is never going to equal another, the references are different. You can only compare primitive types like that. — Dominic, Oct 29 '18 at 11:51

score 2 · Answer 1 · answered Oct 29 '18 at 11:30

Under the hood, Array.prototype.indexOf() is basically performing a strict equality check on each element and returning the index of the first positive result.

In JavaScript, equality of objects is determined on the basis of whether they share the same reference.

An expression comparing Objects is only true if the operands reference the same Object.

To compare objects based on contents, a more involved solution is required - the simplest typically being to wrap each object in JSON.stringify() (although this is very inefficient). More efficient solutions tend to involve comparison of individual keys and values.

See below for a rough demonstration.

const A = {x: 'y'}
const B = {x: 'y'}
const AB = [A, B]
console.log(AB.indexOf(A)) // => 0
console.log(AB.indexOf(B)) // => 1
console.log(A === B) // => false
console.log(A === A) // => true
console.log(JSON.stringify(A) === JSON.stringify(B)) // => true

score 0 · Answer 2 · answered Oct 29 '18 at 11:31

0

it is because these objects doesn't referencing to same object. You can alternatively use this code to get matched index.

reponseValide1.findIndex(obj => obj.title == reponseValide2[0].title)

answered Oct 29 '18 at 11:31

Asim Khan

1,969
12
21

Marco Bonelli · Answer 3 · 2018-10-29T11:41:59.550

"reponseValide2" does contain the same object, with same variables and type

No, it doesn't! It might look like it, but those two are different objects. Equality for object means checking if they are the same instance (i.e. they point to the same address in memory).

Take this code for example:

a = {x: 1}
b = {x: 1}
console.log(a == b)
> false

In the moment of creation, the {x: 1} object is created in memory, and its address is assigned to a. When creating the second object, it will be put in a different memory region, and b will contain a different address than a.

If a and b were the same object, then modifying a would mean modifying b too! For example:

a = {x: 1}
b = a
a.x = 2
console.log(b.x)
> 2

If you really want to have the same object in both your arrays, then you'll have to create it first, then add it to both of them, like this:

var myObj = {
  title: "test"   
};

var reponseValide1 = [
    myObj,
    {text: "test"}
];

var reponseValide2 = [myObj];

console.log(reponseValide1.indexOf(reponseValide2[0]));

However, if you don't want to have the same object, but you want to check if they are equal, you'll have to do it manually, checking for example the text property, like this:

var reponseValide1 = [{
  title: "test"
}, {
  text: "test"
}];
enter code here

var reponseValide2 = [{
  title: "test"
}];

for (var i = 0; i < responseValide1.length; i++) {
    if (responseValide1[i].title == responseValide2[0].title) {
        console.log(i);
        break;
    }
}

Array indexOf checking for object equality

3 Answers3