Why jQuery.inArray doesn't work on array of objects

Question

I have array of objects

var arr = [
        {"id" : "1", "description" : "one"},
        {"id" : "2", "description" : "two"},
        {"id" : "3", "description" : "three"}]

I need get index, for example, for object with id="2".I do

var index = jQuery.inArray( {"id" : "2", "description" : "two"}, arr )

In index I get -1.

JsFiddle

Answer 1

Because inArray uses === to compare elements, and different objects are never === to one another. (They're also not == to one another.)

E.g.:

var a = {"foo": "bar"};
var b = {"foo": "bar"};
console.log(a === b); // "false"

You'll need to create a method on them to compare them for equivalence, and then do the search yourself.

Answer 2

You can use a function that takes a callback:

function arrayFind(arr, fn) {
    for( var i = 0, len = arr.length; i < len; ++i ) {
        if( fn(arr[i]) ) {
            return i;
        }
    }
    return -1;
}

var arr = [
        {"id" : "1", "description" : "one"},
        {"id" : "2", "description" : "two"},
        {"id" : "3", "description" : "three"}
];

var result = arrayFind(arr, function(v){
    return v.id === "2" && v.description === "two";
});
console.log(result) //1

Answer 3

As TJ said, inArray uses === (indexOf actually, but that's the same thing), therefore even identical literals are compared non equal. Here's a workaround:

var index = jQuery.inArray( 
    JSON.stringify({"id" : "2", "description" : "two"}), 
    $.map(arr, JSON.stringify) )

http://jsfiddle.net/7kg9P/1/