findIndex() - метод для поиска индекса первого подходящего элемента массива в JavaScript

findIndex() ищет индекс первого элемента массива, который подходит под условие.

Как только подходящий элемент найден, метод сразу останавливается и возвращает его индекс.

Синтаксис

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

callback - функция, которая проверяет каждый элемент массива.

Что делает findIndex()

Метод проходит по массиву слева направо и вызывает callback для каждого элемента.

Если callback возвращает true, метод считает элемент найденным и возвращает его индекс.

const numbers = [5, 12, 8, 130];
const result = numbers.findIndex((value) => value > 10);

console.log(result); // 1

Здесь индекс 1, потому что первым подходящим элементом оказался 12.

Что возвращает findIndex()

findIndex() возвращает:

• индекс первого подходящего элемента, если он найден
• -1, если ничего не найдено

const numbers = [1, 2, 3];

console.log(numbers.findIndex((value) => value > 2));  // 2
console.log(numbers.findIndex((value) => value > 10)); // -1

Это главное, что нужно запомнить про метод.

Аргументы callback

Callback в findIndex() может получать до трёх аргументов:

array.findIndex((element, index, array) => {
  // ...
});

• element - текущий элемент
• index - индекс текущего элемента
• array - сам исходный массив

Пример:

const fruits = ["apple", "banana", "orange"];

const result = fruits.findIndex((fruit, index) => {
  return index === 1;
});

console.log(result); // 1

Поиск объекта по условию

findIndex() часто используют, когда нужно найти позицию объекта в массиве.

const users = [
  { id: 1, name: "Anna" },
  { id: 2, name: "Ivan" },
];

const index = users.findIndex((item) => item.id === 2);

console.log(index); // 1

Это полезно, если потом нужно обновить или удалить элемент по индексу.

findIndex() останавливается на первом совпадении

Как только найден первый подходящий элемент, дальше массив уже не проверяется.

const numbers = [2, 4, 6, 8];
const result = numbers.findIndex((value) => value > 3);

console.log(result); // 1

Хотя 6 и 8 тоже подходят, метод возвращает только индекс первого совпадения.

findIndex() и find()

Эти методы очень похожи, но возвращают разное.

const numbers = [10, 20, 30];

console.log(numbers.find((value) => value === 20));      // 20
console.log(numbers.findIndex((value) => value === 20)); // 1

find() возвращает сам элемент.

findIndex() возвращает его индекс.

findIndex() и indexOf()

indexOf() ищет точное значение.

findIndex() ищет по условию.

const numbers = [10, 20, 30];

console.log(numbers.indexOf(20));                        // 1
console.log(numbers.findIndex((value) => value > 15));   // 1

Если нужно гибкое условие, обычно используют именно findIndex().

findIndex() не меняет исходный массив

Метод только ищет индекс и не изменяет сам массив.

const numbers = [1, 2, 3];
const result = numbers.findIndex((value) => value === 2);

console.log(numbers); // [1, 2, 3]
console.log(result);  // 1

Пустые слоты

findIndex() проходит и по пустым слотам массива, где значение будет undefined.

const arr = Array(3);

const result = arr.findIndex((value) => value === undefined);

console.log(result); // 0

Это важно помнить при работе с массивами, созданными через Array(length).

Когда это полезно

findIndex() удобно использовать, когда:

• нужен индекс первого подходящего элемента
• нужно найти позицию объекта в массиве
• потом планируется обновление или удаление по индексу

Пример:

const products = [
  { id: 1, name: "Phone" },
  { id: 2, name: "Laptop" },
];

const index = products.findIndex((item) => item.name === "Laptop");

console.log(index); // 1

Частые ошибки

Думать, что findIndex() возвращает элемент

const numbers = [1, 2, 3];
const result = numbers.findIndex((value) => value > 1);

console.log(result); // 1

Это индекс, а не значение 2.

Путать findIndex() и indexOf()

const users = [{ id: 1 }, { id: 2 }];

const index = users.findIndex((user) => user.id === 2);

Для поиска по условию indexOf() уже не подходит.

Забывать, что при отсутствии результата будет -1

const numbers = [1, 2, 3];

console.log(numbers.findIndex((value) => value > 10)); // -1

Это нормальный результат, а не ошибка.

Быстрая памятка

• findIndex() возвращает индекс первого элемента, подходящего под условие
• если ничего не найдено, метод вернёт -1
• callback может получать element, index и array
• findIndex() останавливается на первом совпадении
• find() возвращает элемент, а findIndex() - его индекс

Коротко

findIndex() - это удобный способ найти позицию первого подходящего элемента массива. Главное, что стоит запомнить: метод возвращает индекс, а если ничего не найдено, отдаёт -1.