How to Get Index of Element in Array in JavaScript

by

Method 1: Using the array indexOf() function

To get an index of an element in JavaScript, you can use the “indexOf()” function. The array indexOf() is a built-in method that returns the first index at which a given element can be found in the array, or -1 if it is not present.

Syntax

indexOf(search,startingIndex);

Parameters

Search – We need to provide the search value in this first parameter. Therefore, it is a required parameter.

startingIndex – We can provide a starting index to his parameter. So it will start matching values by this index. This is an optional parameter.

Return value

It returns the index of that element; otherwise, it returns -1.

Example

const avengers = ["Thor", "Iron man", "loki", "hulk", "wanda", "dr strange"];

console.log("Index of loki: ", avengers.indexOf("loki"));
console.log("Index of hulk: ", avengers.indexOf("hulk"));
console.log("Index of Thor: ", avengers.indexOf("Thor"));
console.log("wrong value index: ", avengers.indexOf("captain"));

Output

Index of loki: 2
Index of hulk: 3
Index of Thor: 0
wrong value index: -1

In the above example, we get an index of the element by using the built-in array method. However, in the last console.log, passing a value, not inside the array will return -1.

Method 2: Using the findIndex() method

JavaScript findIndex() is a built-in method that executes a function for each array element. The findIndex() method returns the index (position) of the first element that passes a test. The findIndex() method returns -1 if no match is found.

Syntax

// Arrow function
findIndex(()=>{});
 
// Callback
findIndex(function);
 
// Inline
findIndex(function(){});

Parameters

  1. element: It will give a current element as a parameter.
  2. index: It will give a current element index as the second parameter.
  3. array: It will give a whole array as a parameter.

Return value

The findIndex() function returns the index of that element; otherwise, it returns -1.

Example

const values = [34, 12, 89, 49, 21, 43, 1];
// Arrow function
console.log(values.findIndex((element) => element > 40));

values.findIndex((element, index) => {
  if (element > 40) {
   console.log(`index of ${element} is ${index}`)
  }
});

Output

2
index of 89 is 2
index of 49 is 3
index of 43 is 5

In the above example, we get the element index by the findIndex() method, and it iterates the whole array and runs the test function, and based on that function, it will give a value.

Method 3: Using the forEach() function

We get an index of an element by using a custom function with the forEach() function to iterate that array and find the index of that passed element.

Example

const avengers = ["Thor", "Iron man", "loki", "hulk", "wanda", "dr strange"];

function getElementIndex(value, array) {
   let index = -1;
   array.forEach((item, i) => {
     if (item === value) {
        index = i;
   }
 });
 return index;
}

console.log("index of loki is : ", getElementIndex("loki", avengers));

Output

index of loki is : 2

That’s it for this tutorial.

Leave a Comment