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.

@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. — Bouke
– Bouke, Commented Sep 11, 2015 at 13:03

GOTO 0 · Accepted Answer · 2018-06-15 01:12:19Z

15

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;
    }
}

edited Jun 15, 2018 at 1:12

answered Sep 11, 2015 at 13:18

GOTO 0

48.8k25 gold badges139 silver badges165 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

ykay says Reinstate Monica · Accepted Answer · 2016-12-22 11:53:53Z

3

You can do this with map and combining the properties:

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

edited Dec 22, 2016 at 11:53

answered Dec 22, 2016 at 11:12

ykay says Reinstate Monica

4,9224 gold badges35 silver badges44 bronze badges

1 Comment

Heretic Monkey Over a year ago

Great, until you have a color named redc and a shape named ircle ;).

maioman · Accepted Answer · 2015-09-11 14:19:50Z

1

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}))

edited Sep 11, 2015 at 14:19

answered Sep 11, 2015 at 13:10

maioman

18.8k4 gold badges39 silver badges46 bronze badges

Collectives™ on Stack Overflow

IndexOf Method for Multiple Properties in Object Array

3 Answers 3

Comments

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related