Javascript array objects index

Last updated: Jan 8, 2023
Reading time · 5 min

banner

# Table of Contents

# Get the index of an Object in an Array in JavaScript

To find the index of an object in an array by a specific property:

Use the findIndex() method to iterate over the array.
Check if each object has a property with the specified value.
The findIndex() method will return the index of the first object that matches the condition.

Copied!
const arr = [id: 'a'>, id: 'b'>, id: 'c'>]; const index = arr.findIndex(object =>  return object.id === 'b'; >); console.log(index); // 👉️ 1

The function we passed to the Array.findIndex() method gets called with each element (object) in the array until it returns a truthy value or iterates over all array elements.

On each iteration, we check if the object’s property is equal to a specific value and return true or false .

The findIndex() method returns the index of the first object that meets the condition.

If the function we passed to the findIndex() method never returns a truthy value, the method returns -1 .

Alternatively, you can use the Array.map() method.

# Get the index of an Object in an Array using Array.map()

This is a three-step process:

Use the map() method to iterate over the array.
Return only the values of the relevant property.
Use the indexOf() method to get the index of the object in the array.

Copied!
const arr = [id: 'a'>, id: 'b'>, id: 'c'>]; const index = arr.map(object => object.id).indexOf('c'); console.log(index); // 👉️ 2

We used the Array.map() method to get an array containing the values of the specified property.

Copied!
const arr = [id: 'a'>, id: 'b'>, id: 'c'>]; const values = arr.map(object => object.id) console.log(values) // 👉️ ['a', 'b', 'c']

The last step is to use the Array.indexOf method to get the index of the value in the array.

The map() method iterates over all of the array’s elements, so the ordering of the elements is preserved.

The indexOf method returns the index of the first object that meets the condition.

If the indexOf() method doesn’t find an element with the given value, it returns -1 , just like the findIndex() method.

I’ve also written a detailed guide on how to filter an array of objects.

# Get the Indexes of all Objects in an Array that match a condition

To get all indexes of all objects in an array that match a condition:

Use the map() method to iterate over the array.
Check if each object matches the condition and return the matching indexes.
Use the filter() method to remove all undefined values from the array.

Copied!
const arr = [name: 'Alice'>, name: 'Bob'>, name: 'Charlie'>]; const indexes = arr .map((element, index) =>  if (element.name === 'Alice' || element.name === 'Bob')  return index; > >) .filter(element => element >= 0); console.log(indexes); // 👉️ [0 , 1]

The function we passed to the Array.map() method gets called with each element (object) in the array.

If the condition is met, we return the element’s index, otherwise, the function implicitly returns undefined .

The return value of the map() method will contain the indexes of the array elements that meet the condition and an undefined value for each element that doesn’t.

Copied!
const arr = [name: 'Alice'>, name: 'Bob'>, name: 'Charlie'>]; // 👇️ [0, 1, undefined] console.log( arr.map((element, index) =>  if (element.name === 'Alice' || element.name === 'Bob')  return index; > >), );

We used the Array.filter method to remove the undefined values from the array.

In the callback function we passed to the filter() method, we check if the element is greater than or equal to 0 .

The filter method returns a new array that contains the indexes of all elements that meet the condition.

You can also use the Array.some() method to get the index of an object in an array.

If you need to update an object’s property in an array of objects, follow the instructions in this article.

# Get the index of an Object in an Array using Array.some()

This is a three-step process:

Use the Array.some() method to iterate over the array.
Check if the current object has a property equal to the specified value.
If the condition is met, assign the current index to a variable.

Copied!
const arr = [id: 'a'>, id: 'b'>, id: 'c'>]; let index; arr.some((object, idx) =>  if (object.id === 'b')  index = idx; return true; > >); console.log(index); // 👉️ 1

The function we passed to the Array.some() method gets called with each element (object) in the array.

If at least one invocation of the callback function returns a truthy value, the some() method returns true , otherwise, false is returned.

On each iteration, we check if the current object has an id property with the specified value.

If the condition is met, we assign the current index to the index variable and return true to break out of the loop.

You can initialize the index variable to a different value, e.g. -1 if you want the variable to store -1 in case an object with the specified value isn’t found.

Copied!
const arr = [id: 'a'>, id: 'b'>, id: 'c'>]; let index = -1; arr.some((object, idx) =>  if (object.id === 'ASDF')  index = idx; return true; > >); console.log(index); // 👉️ -1

None of the objects in the array meets the condition, so the index variable remains set to -1 .

Want to learn more about working with an array of objects in JavaScript ? Check out these resources: Remove Duplicates from an Array of Objects in JavaScript ,Convert an Array of Objects to an Array of Values in JS.

# Get the index of an Object in an Array using a for loop

This is a three-step process:

Use a for loop to iterate over the array.
Check if the current object has a property with the specified value.
If the condition is met, assign the current index to a variable.

Copied!
const arr = [id: 'a'>, id: 'b'>, id: 'c'>]; let index; for (let idx = 0; idx  arr.length; idx++)  if (arr[idx].id === 'b')  index = idx; break; > > console.log(index); // 👉️ 1

We used a for loop to iterate over the array of objects.

On each iteration, we check if the current object has an id property equal to a specific value.

If the condition is met, we assign the current index to a variable and exit the for loop.

The break statement is used to end the for loop prematurely to avoid iterating needlessly.

# Additional Resources

You can learn more about the related topics by checking out the following tutorials:

I wrote a book in which I share everything I know about how to become a better, more efficient programmer.

Источник

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:

Using findIndex() Method

Using Loop

Using find() method with indexOf() Method

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.

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

The function accepts three arguments:

element: The current element being processed in the array.
index: The index of the current element being processed in the array.
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.

// 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]);

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.

// 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]);

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.

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

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:

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

// 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);

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.

Источник

How to Get the Index of an Array that Contains Objects in JavaScript

There are several methods in JavaScript that can help you access the index of the object from the array of an object. Let’s have a look at each method and find the most appropriate one for your case.

map()

The map() method creates a separate array and calls a function for every array element. This method invokes the defined function once for every element in the array, maintaining the order:

Javascript find index of an array that contains object

for loop

Another fast method is the for loop setted up inside a prototype:

Javascript find index of an array that contains object

findIndex()

You can also use a native and convenient function findIndex() as follows:

Javascript find index of an array that contains object

The Array.prototype.findIndex() method returns an index in the array if an element in the array satisfies the provided testing function; otherwise, it will return -1, which indicates that no element passed the test. It executes the callback function once for every index in the array until it finds the one where callback returns true.

How to Check if an Element is Present in an Array in JavaScript?
How to Find the Min/Max Elements in an Array in JavaScript
How to Remove Objects from a JavaScript Associative Array
How to Remove an Element from an Array in JavaScript
How to Loop Through or Enumerate a JavaScript Object
How to Get the First Key Name of a JavaScript Object
How to Check if a Value is an Object in JavaScript
How to Check if a Key Exists in JavaScript Object
How to Loop through an Array in JavaScript
How to Check if JavaScript Object is Empty
How to Get a Class Name of an Object
How to Sort JavaScript Object by Key
How to Sort an Array of Integers

Источник

Javascript array objects index