52

if I have an array like:

var myArray = [
                {
                    'color':'red',
                    'name': 'redName'
                },
                {
                    'color':'blue',
                    'name': 'blueName'
                },
                {
                    'color':'green',
                    'name': 'greenName'
                    },
                {
                    'color':'yellow',
                    'name': 'yellowName'
                },
             ];

How do I get the index of say, "blue"?

9 Answers 9

71

If you're already using ECMAScript 5 in your code you can use that:

myArray
    .map(function (element) {return element.color;})
    .indexOf('blue');

Note that the support to these functions is a quite limited (they don't work on Internet Explorer 8).

Also, if you're in the future, and you're using ES6 you can do that:

myArray.map((el) => el.color).indexOf('blue');

That's the same as above, but smaller.

3
  • this is an elegant solution
    – DariusVE
    Commented Apr 23, 2015 at 20:20
  • 6
    "if you're in the future" kudos!
    – Madivad
    Commented Dec 15, 2015 at 11:03
  • 9
    There is a function which simplifies more the code above: myArray.findIndex(el => el.color === 'blue'); It's supported on many modern browsers. Commented Mar 31, 2016 at 10:11
54
for(var i = 0; i < myArray.length; i++) {
   if(myArray[i].color === 'blue') {
     return i;
   }
}

There's no "clean" way unless you want to involve a third-party library. Underscore is a good one for stuff like this.

3
  • The link in this answer is broken now. Commented Aug 1, 2017 at 0:10
  • @AndersonGreen fixed, thank you! also, this answer is pretty old. I recommend Lodash now. ES5 also provides a native find() implementation to the Array prototype. Commented Aug 14, 2017 at 18:43
  • Would be great if you could add the Lodash function for it
    – Anthony
    Commented Jan 10, 2019 at 19:11
42

I know this is super old but Javascript es6 has an awesome method Array.prototype.findIndex(), so you could just do:

let index = myArray.findIndex((item) => item.color === 'blue');
// value of index will be "1"
1
  • and if there's no 'blue' color, the value will be -1 <- use this if you need to make any checks based on the index itself
    – Bullsized
    Commented Dec 14, 2022 at 15:11
11

That's not a multi-dimensional array (or even a jagged array, which is used instead of multi-dimensional arrays in Javascript as they don't exist). That is an array of objects.

You can loop through the items in the array:

var index;
for (var i = 0; i < myArray.length; i++) {
  if (myArray[i].color == 'blue') {
    index = i;
    break;
  }
}

Now the variable index contains the value 1, with your given example.

0
6

You can use .findIndex() method

In your case

var findeMe = "blue";
myArray.findIndex(function(row){
return row.color == findMe;
});

I hope it help.

0
2

I'm guessing you mean from your example to return "1"? Here is a function for you...

<script type='text/javascript'>
var myArray = [
                {
                    'color':'red',
                    'name': 'redName'
                },
                {
                    'color':'blue',
                    'name': 'blueName'
                },
                {
                    'color':'green',
                    'name': 'greenName'
                    },
                {
                    'color':'yellow',
                    'name': 'yellowName'
                },
             ];
function getIndexOf(a,v) {
  var l = a.length;
  for (var k=0;k<l;k++) {
    if (a[k].color==v) {
        return k;
      }
  }                      
  return false;
}

alert (getIndexOf(myArray,'blue'));
</script>
2

For example like this:

DEMO

Array.prototype.objIndexOf = function(val) {
    var cnt =-1;
    for (var i=0, n=this.length;i<n;i++) {
      cnt++;
      for(var o in this[i]) {
        if (this[i].hasOwnProperty(o) && this[i][o]==val) return cnt;
      }
    }
    return -1;
}
var myArray = [
                {
                    'color':'red',
                    'name': 'redName'
                },
                {
                    'color':'blue',
                    'name': 'blueName'
                },
                {
                    'color':'green',
                    'name': 'greenName'
                    },
                {
                    'color':'yellow',
                    'name': 'yellowName'
                },
             ];
    alert(myArray.objIndexOf('blue'))
2
0

Iterate over the array, looking for the value inside each element object. Raw JavaScript doesn't give you a whole lot to work with.

3
  • ...I take it there's no indexOf for a multidimensional array? Commented Nov 29, 2011 at 15:31
  • 2
    @redconservatory Well, that's not a multi-dimensional array. But no, there isn't. There are a ton of implementations you could add to the array prototype, or just do it manually. Commented Nov 29, 2011 at 15:34
  • there is not. But I just want to make sure you have something clear here...it seems your question is to look up the key of a value, which would be like php's array_search(). But "indexOf" is more like php's strpos() in that it looks to see if a string is within another string (and returns position of occurrence). Commented Nov 29, 2011 at 15:36
0

In my case, I have built my own functions because I wanted the loop to stop at the first element found.

That's why the solutions with map were not working to this case as they are creating a new array.

  var i = 0;
  while (i < myArray.length) {
    if (myArray[i].color == 'blue') {
      return i;
    }
    i++
  }
  return -1

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.