JavaScript Tutorials

JavaScript Array findIndex()
Syntax & Examples

Array.findIndex() method

The findIndex() method of the Array class in JavaScript returns the index of the first element in the array that satisfies the provided testing function. If no element satisfies the testing function, -1 is returned.

Syntax of Array.findIndex()

There are 2 variations for the syntax of Array.findIndex() method. They are:

1.
findIndex(callbackFn)

Parameters

ParameterOptional/RequiredDescription
callbackFnrequiredA function to test each element in the array. It takes three arguments: element, index, and array.

This method returns the index of the first element in the array that satisfies the provided testing function.

Returns value of type Number.

2.
findIndex(callbackFn, thisArg)

Parameters

ParameterOptional/RequiredDescription
callbackFnrequiredA function to test each element in the array. It takes three arguments: element, index, and array.
thisArgoptionalA value to use as this when executing callbackFn.

This method returns the index of the first element in the array that satisfies the provided testing function, using thisArg as the value of this inside callbackFn.

Returns value of type Number.


✐ Examples

1 Using findIndex() method to find the index of the first even number

In JavaScript, we can use the findIndex() method to find the index of the first even number in an array.

For example,

  1. We define an array variable arr with elements [1, 3, 7, 8, 10].
  2. We define a callback function isEven to check if each element is an even number.
  3. We use the findIndex() method with isEven to find the index of the first even number in the array.
  4. The result is stored in the variable indexOfFirstEven.
  5. We log indexOfFirstEven to the console using console.log() method to see the index of the found element.

JavaScript Program

const arr = [1, 3, 7, 8, 10];
const isEven = element => element % 2 === 0;
const indexOfFirstEven = arr.findIndex(isEven);
console.log(indexOfFirstEven);

Output

3

2 Using findIndex() method to find the index of the first string with length greater than 3

We can use the findIndex() method to find the index of the first string with length greater than 3 in an array.

For example,

  1. We define an array variable strArr with elements ['a', 'bc', 'def', 'ghij'].
  2. We define a callback function isLengthGreaterThanThree to check if the length of each string is greater than 3.
  3. We use the findIndex() method with isLengthGreaterThanThree to find the index of the first string with length greater than 3 in the array.
  4. The result is stored in the variable indexOfLongString.
  5. We log indexOfLongString to the console using console.log() method to see the index of the found element.

JavaScript Program

const strArr = ['a', 'bc', 'def', 'ghij'];
const isLengthGreaterThanThree = element => element.length > 3;
const indexOfLongString = strArr.findIndex(isLengthGreaterThanThree);
console.log(indexOfLongString);

Output

3

3 Using findIndex() method with a thisArg

We can use the findIndex() method with a thisArg to find the index of an element in an array using a specific context.

For example,

  1. We define an array variable arr with elements [5, 12, 8, 130, 44].
  2. We define an object context with a threshold property set to 10.
  3. We define a callback function isGreaterThanThreshold to check if each element is greater than the threshold property of the context object.
  4. We use the findIndex() method with isGreaterThanThreshold and context as thisArg to find the index of the first element greater than the threshold.
  5. The result is stored in the variable indexOfFoundElement.
  6. We log indexOfFoundElement to the console using console.log() method to see the index of the found element.

JavaScript Program

const arr = [5, 12, 8, 130, 44];
const context = { threshold: 10 };
function isGreaterThanThreshold(element) {
  return element > this.threshold;
}
const indexOfFoundElement = arr.findIndex(isGreaterThanThreshold, context);
console.log(indexOfFoundElement);

Output

1

Summary

In this JavaScript tutorial, we learned about findIndex() method of Array: the syntax and few working examples with output and detailed explanation for each example.