IndexOf Method for Multiple Properties in Object Array

Question

What's the best method to get the index of an object in an object array given multiple of it's properties?

Imagine the following example array:

var array = [
 {
 color: 'red',
 shape: 'square',
 weight: 200
 },
 {
 color: 'blue',
 shape: 'circle',
 weight: 300
 },
 {
 color: 'red',
 shape: 'circle',
 weight: 100
 }
];

Now I would like to have the indexOf the object which color property is red and shape is circle which, in this example, would be 2.

Ideally the function would return the index of the object when a subset of its properties is given like {color: 'red', shape: 'circle'} and return -1 if no index is found.

• Bouke: @JoelEtherton What I have tried is looping of the array and then also looping over the properties but the part where I am stuck is getting only the index of the item that matches both values. The IndexOf just color red is different then shape circle.

Answer 1

In ES6, there is the array method findIndex:

let index = array.findIndex(
 element => element.color === 'red' && element.shape === 'circle'
);

Until then, stick to a plain iteration:

var index = -1; // -1 if not found
for (var i = 0; i < array.length; ++i)
{
 var element = array[i];
 if (element.color === 'red' && element.shape === 'circle')
 {
 index = i;
 break;
 }
}

Answer 2

You can do this with map and combining the properties:

var index = array.map(function(o){return o.color + o.shape}).indexOf('red' + 'circle')

• Heretic Monkey: Great, until you have a color named redc and a shape named ircle ;).

Answer 3

you could achieve this using map array method:

var array = [
{
 color: 'red',
 shape: 'square',
 weight: 200
},
{
 color: 'blue',
 shape: 'circle',
 weight: 300
},
{
 color: 'red',
 shape: 'circle',
 weight: 100
}
];
 
 var res = array.map(function(x,i){
 if( x.color == 'red')
 return i;
 
 })
//then you can filter out results to your needs
console.log(res.filter(function(x){return x != undefined}))