JavaScript Array findIndex() Method

What You’ll Learn

The findIndex() method returns the index of the first element that passes your test, or -1 if none match. It pairs naturally with splice and bracket updates. This tutorial covers syntax, five examples, and comparisons with find() and indexOf().

Introduction

Sometimes you need to know where an item lives, not just what it is. Maybe you will update that slot, remove it with splice, or scroll a list to the matching row. findIndex() gives you that position.

It mirrors find() in search logic but returns a number instead of the element. When nothing matches, you get -1—the same convention as indexOf.

Understanding the findIndex() Method

array.findIndex(callback) walks the array from index 0 upward. For each element it runs your callback with (element, index, array). The first truthy result stops the search and returns that index.

If every callback is falsy, the method returns -1.

📝 Syntax

General form of Array.prototype.findIndex:

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

Parameters

• callback — predicate tested on each element; first truthy match wins.
• element — current array item.
• index — optional; position of the element (also usable inside the test).
• array — optional; the array being searched.
• thisArg — optional; value to use as this inside the callback.

Return value

• Index of the first matching element (0-based).
• -1 if no element passes the test.
• Original array unchanged by findIndex() itself.

Common patterns

• arr.findIndex(n => n > 25) — first value above 25.
• items.findIndex(i => i.id === id) — lookup by id.
• if (i !== -1) arr.splice(i, 1) — remove first match.
• if (i !== -1) arr[i] = updated — replace in place.

Examples Gallery

Open DevTools Console (F12) or use Try-it labs. Example N maps to ?tryit=N.

const numbers = [10, 20, 30, 40, 50];

const index = numbers.findIndex((num) => num > 25);

console.log(index);
// 2

2

const numbers = [10, 20, 30, 40, 50];

const index = numbers.findIndex((num) => num > 100);

if (index === -1) {
  console.log("No element greater than 100 found.");
} else {
  console.log("Found at index:", index);
}
// No element greater than 100 found.

No element greater than 100 found.

const numbers = [10, 20, 30, 40, 50];

const evenIndex = numbers.findIndex((_num, index) => index % 2 === 0);

console.log(evenIndex);
// 0

0

const users = [
  { id: 1, name: "Alice" },
  { id: 2, name: "Bob" },
  { id: 3, name: "Charlie" }
];

const index = users.findIndex((user) => user.name === "Bob");

console.log(index);
// 1

1

const todos = [
  { id: 1, text: "Buy milk", done: false },
  { id: 2, text: "Walk dog", done: false }
];

const i = todos.findIndex((t) => t.id === 2);

if (i !== -1) {
  todos[i] = { ...todos[i], done: true };
}

console.log(todos[1]);
// { id: 2, text: "Walk dog", done: true }

{ id: 2, text: "Walk dog", done: true }

🚀 Common Use Cases

• In-place updates — find index, then assign or splice.
• UI selection — highlight the row at the returned index.
• Validation — locate the first failing field in an array.
• Duplicate checks — find if another item shares a key.
• Queue processing — find the first pending job index.
• Immutable patterns — combine with spread to replace one slot immutably.

📝 Notes

• Returns -1 on failure—same as indexOf, unlike find() which returns undefined.
• Index 0 is valid; never use if (index) as a found check.
• Short-circuits on the first match; later duplicates are ignored.
• Holey arrays may still invoke the callback with undefined at hole indexes.
• For the last match, use findLastIndex() (ES2023).
• ES2015 method—polyfill needed for Internet Explorer.

💡 Best Practices