JavaScript Find Index Of Object In Array


In this article, you will know how to find the index of an object in an array using JavaScript. You will see different methods to select an object from an array and find the index of that object.

Real-life data are generally an array of objects and we need to find a specific object from the array on the basis of some property of that object.

Suppose we have an array of students, where a student is an object that has name, roll, and age properties. We can find the index of a student in the array on the basis of any of their property.

Here is the list of methods of how javascript find index of object in array:

    Table Of Contents

  1. Using findIndex() Method
  2. Using Loop
  3. Using find() method with indexOf() Method
Javascript find index of object in array

1. Find Index Of Object Using findIndex() Method

The findIndex() method is used to find the index of an element in an array.

The method executes a provided function once for each element present in the array, in order.

It then returns the index of the first element that satisfies the provided testing function.

If no element is found, the method returns -1.

Syntax:

array.findIndex(callback(element, index, array)

The function accepts three arguments:

  1. element: The current element being processed in the array.
  2. index: The index of the current element being processed in the array.
  3. array: The array findIndex() is being called on.

We can use the first argument of the function (which is an object in this case) to find if it is desired object or not.

Example

// array of objects
let students = [
  { name: 'John', roll: 1, age: 24 },
  { name: 'Peter', roll: 2, age: 20 },
  { name: 'Mary', roll: 3, age: 19 },
  { name: 'Bill', roll: 4, age: 22 }
];

// using findIndex() method
let index = students.findIndex(function (item) {
  return item.name === 'Peter';
});
// found index
console.log("index = " + index);
// found object
console.log("Object => " , students[index]);

Output:

javascript find index of object output 1

You can see in the above output that the method returns the index of the object that has name as 'Peter'.

You can also use the arrow function in the method to make the code more concise.

Example

// array of objects
let students = [
  { name: 'John', roll: 1, age: 24 },
  { name: 'Peter', roll: 2, age: 20 },
  { name: 'Mary', roll: 3, age: 19 },
  { name: 'Bill', roll: 4, age: 22 }
];
    
// using findIndex() method
let index = students.findIndex(item => item.name === 'Peter');
// found index
console.log("index = " + index);
// found object
console.log("Object => " , students[index]);

Output:

javascript find index of object output 1

2. Find Index Of Object Using Loop

This is very simple approach to find the index of an object in an array. You can use a loop to iterate through the array and check if the object has the desired property.

In the example below we are using for loop to iterate through the array.

Find object that has age as 19.

Example

// array of objects
let students = [
  { name: 'John', roll: 1, age: 24 },
  { name: 'Peter', roll: 2, age: 20 },
  { name: 'Mary', roll: 3, age: 19 },
  { name: 'Bill', roll: 4, age: 22 }
];

// using for loop
for (let i = 0; i < students.length; i++) {
  if (students[i].age === 19) {
    console.log("index = " + i);
    console.log("Object => " , students[i]);
    break;
  }
}

Output:

javascript find index of object output 2

In the above example we simply iterated through every element of the array and checked if the object's age property is equal to 19. If it is, we printed the index of the object and the object itself and then break the loop.


3. Find Index Of Object Using find() method with indexOf() Method

The find() method is another array method. It is used to find the first element in an array that satisfies a given condition.

The method executes a function and checks some condition on each element of the array and return the first element that satisfies the condition.

Unlike findIndex() method that finds index of an object, find() method finds the element. So to get the index of element we can use indexOf() method.

Steps we need to follow to find the index of an object in an array:

  1. Find the desired object from the array of object using find() method.
  2. Store the reference of object in a variable.
  3. Use indexOf() method to find the index of the object.

Example

// array of objects
let students = [
  { name: 'John', roll: 1, age: 24 },
  { name: 'Peter', roll: 2, age: 20 },
  { name: 'Mary', roll: 3, age: 19 },
  { name: 'Bill', roll: 4, age: 22 }
];

// find object with roll as 4
let found = students.find(item => item.roll === 4);

// find index using indexOf() method
let index = students.indexOf(found);
console.log("index = " + index);
console.log("Object => " , found);

Output:

javascript find index of object output 3

Conclusion

In this short guide, we have covered 3 different ways of how javascript find index of object in array. The discussed method are 1. findIndex() method, 2. for loop and 3. find() method with indexOf() method.