Trouble using indexOf on a complex array [duplicate]

Question

Possible Duplicate:
indexOf method in an object array?

I have a javascript array which follows this format:

var arrayName = [
{id: "a", gender: "man",   item: "stuff"},
{id: "b", gender: "woman", item: "stuff"},
{id: "c", gender: "man",   item: "stuff"},
{id: "d", gender: "man",   item: "stuff"}
];

Is there a way that I can use array.indexOf to find an index in the array, when for example I know the "id" variable.

For example I tried;

var position = arrayName.indexOf("b");
arrayName[position].gender = "man"

At the moment I am using;

for(var i=0; i<arrayName.length; i++) {
   if(arrayName[i].id == "b"){
       arrayName[i].gender = "man";
   }
}

This second technique works but the actual array I am using has 150 entries and 10 items in each entry so looping through it all seems very wasteful when I know the "id" of the entry I want to edit. indexOf would be a much cleaner approach if I can get it working.

Answer 1

Your call to indexOf is checking the objects in your array against the string b, which will never work.

Looping through the array elements to find the right id is a simple solution.

Or, you could make your own indexOf function:

Array.prototype.indexOfId = function(id) {
    for (var i = 0; i < this.length; i++)
        if (this[i].id === id)
            return i;
    return -1;
}

    var arrayName = [
      { id: "a", gender: "man", item: "stuff" },
      { id: "b", gender: "woman", item: "stuff" },
      { id: "c", gender: "man", item: "stuff" },
      { id: "d", gender: "man", item: "stuff" }];

    var position = arrayName.indexOfId("b");

    alert(position);  //alerts 1

Here's a fiddle

EDIT

If you want to compare your array elements to any property, here's how you do it (note that I'm using [] syntax to get an arbitrary property)

    Array.prototype.indexOfField = function (propertyName, value) {
        for (var i = 0; i < this.length; i++)
            if (this[i][propertyName] === value)
                return i;
        return -1;
    }

    var position = arrayName.indexOfField("id", "b");
    alert(position);  //alerts 1

    position = arrayName.indexOfField("gender", "man");
    alert(position); //alerts 0

---

Or, if you don't want to mess with Array's prototype, and you don't mind using features not present in older browsers, you could use Array's filter function

var position = arrayName.indexOf(arrayName.filter(function (val) {
      return val.id === "b";
})[0]);

Note that this function is not present in IE8, and so to support this browser you'd have to grab the shim from MDN

EDIT - oops, indexOf isn't friendly toward old browsers either. If you opt for this second bit of code and wanted to support IE, you'd also have to grab the shim for indexOf from here

Answer 2

If you have the opportunity to, you can use Array.prototype.filter:

var arrayName = [
    {id: "a", gender: "man",   item: "stuff"},
    {id: "b", gender: "woman", item: "stuff"},
    {id: "c", gender: "man",   item: "stuff"},
    {id: "d", gender: "man",   item: "stuff"}
];

console.log(arrayName.filter(function(i) {
    return i.id === 'b';
}));

Which will give:

[ { id: 'b', gender: 'woman', item: 'stuff' } ]