Как вернуть индекс элемента массива javascript

.find Index ( )

Найдёт индекс первого подходящего под условие элемента.

Время чтения: меньше 5 мин

Открыть/закрыть навигацию по статье

Обновлено 29 мая 2022

Кратко

Скопировать ссылку «Кратко» Скопировано

Метод find Index ( ) возвращает индекс первого найденного в массиве элемента, который подходит под условие переданной функции. Если же ни одного подходящего элемента не найдётся, то метод вернёт -1 .

Если вам нужно получить элемент, а не его индекс, то используйте метод find ( ) . А если необходимо проверить наличие чего-либо в массиве, то сначала обратите внимание на метод includes ( ) .

Пример

Скопировать ссылку «Пример» Скопировано

Напишем код, который позволит найти человека в списке гостей мероприятия. Для этого определим функцию, которая будет получать имя из массива участников и сверять его с константой guest Name . Затем передадим эту функцию в метод find Index ( ) :

 function isWantedGuest(element, index, array)  const guestName = 'Лиза' return element === guestName> const partyGuests = [ 'Даня', 'Саша', 'Юля', 'Лиза', 'Егор'] const meetingGuests = [ 'Даня', 'Егор', 'Арсений'] console.log(partyGuests.findIndex(isWantedGuest))// 3 (так как partyGuests[3] -> 'Лиза') console.log(meetingGuests.findIndex(isWantedGuest))// -1 (совпадений нет) function isWantedGuest(element, index, array)  const guestName = 'Лиза' return element === guestName > const partyGuests = [ 'Даня', 'Саша', 'Юля', 'Лиза', 'Егор' ] const meetingGuests = [ 'Даня', 'Егор', 'Арсений' ] console.log(partyGuests.findIndex(isWantedGuest)) // 3 (так как partyGuests[3] -> 'Лиза') console.log(meetingGuests.findIndex(isWantedGuest)) // -1 (совпадений нет)    Скопировать Скопировано Не удалось скопировать   

Интерактивный пример

Скопировать ссылку «Интерактивный пример» Скопировано

Как пишется

Скопировать ссылку «Как пишется» Скопировано

Метод find Index ( ) обходит массив и возвращает индекс первого элемента, который подходит под условие функции-предиката. Если ничего не подошло, то он возвращает -1 .

Предикативная функция (функция-предикат) — это функция, которая проверяет значение на соответствие какому-то условию, а затем возвращает true или false .

Функция, которую мы передаём в метод find Index ( ) , может принимать три параметра:

• element — элемент массива в текущей итерации;
• index — индекс текущего элемента;
• array — сам массив, который перебираем.

Определим функцию is Even , которая проверяет, является ли число чётным, то есть делится на два без остатка. А затем найдём в массиве индекс первого такого числа через find Index ( ) .

 // Если число чётное — вернёт true,// если нечётное — falsefunction isEven(element)  return element % 2 === 0> const onlyOddNumbers = [1, 3, 5, 7, 9]const randomNumbers = [7, 1, 6, 3, 5] console.log(onlyOddNumbers.findIndex(isEven))// -1 (элемент не найден) console.log(randomNumbers.findIndex(isEven))// 2 (так как randomNumbers[2] -> 6) // Если число чётное — вернёт true, // если нечётное — false function isEven(element)  return element % 2 === 0 > const onlyOddNumbers = [1, 3, 5, 7, 9] const randomNumbers = [7, 1, 6, 3, 5] console.log(onlyOddNumbers.findIndex(isEven)) // -1 (элемент не найден) console.log(randomNumbers.findIndex(isEven)) // 2 (так как randomNumbers[2] -> 6)    Скопировать Скопировано Не удалось скопировать   

В этом примере функция is Even не использует параметры index и array , поэтому мы не стали их объявлять.

Как понять

Скопировать ссылку «Как понять» Скопировано

Найти индекс первого подходящего элемента можно и с помощью цикла for , но метод find Index ( ) позволяет сделать это декларативно. С помощью функции-колбэка мы описываем, какой элемент мы ищем и не описываем как должен происходить поиск. Поиск с помощью цикла for содержал бы гораздо больше деталей.

Давайте сами попробуем реализовать find Index ( ) , чтобы лучше понять, как он работает «под капотом».

 function findIndex(array, predicate)  for (let i = 0; i < array.length; i++)  // Если элемент удовлетворяет условию, // то возвращаем его индекс if (predicate(array[i], i, array))  return i > > // Если ничего не подошло, // то возвращаем -1 return -1> function isEven(element)  return element % 2 === 0> const onlyOddNumbers = [1, 3, 5, 7, 9]const randomNumbers = [7, 1, 6, 3, 5] console.log(findIndex(onlyOddNumbers, isEven))// -1 console.log(findIndex(randomNumbers, isEven))// 2 function findIndex(array, predicate)  for (let i = 0; i  array.length; i++)  // Если элемент удовлетворяет условию, // то возвращаем его индекс if (predicate(array[i], i, array))  return i > > // Если ничего не подошло, // то возвращаем -1 return -1 > function isEven(element)  return element % 2 === 0 > const onlyOddNumbers = [1, 3, 5, 7, 9] const randomNumbers = [7, 1, 6, 3, 5] console.log(findIndex(onlyOddNumbers, isEven)) // -1 console.log(findIndex(randomNumbers, isEven)) // 2    Скопировать Скопировано Не удалось скопировать   

Подсказки

Скопировать ссылку «Подсказки» Скопировано

�� Если используете find Index в условии, то всегда явно проверяйте возвращаемое значение на -1 .

На практике

Скопировать ссылку «На практике» Скопировано

Сергей Минаков советует

Скопировать ссылку «Сергей Минаков советует» Скопировано

�� indexOf или findIndex

Скопировать ссылку «�� indexOf или findIndex» Скопировано

Помимо find Index ( ) , у массивов есть ещё и метод index Of ( ) . Он работает схожим образом: возвращает индекс первого подходящего элемента или -1 , но, в отличие от find Index ( ) , принимает как аргумент не функцию-предикат, а искомое значение.

 const numbers = [1, 7, 4, 6, 2, 8, 3] console.log(numbers.indexOf(2))// 4 (значение 2 хранится по индексу 4) numbers.findIndex((element) => element === 2)// 4 const numbers = [1, 7, 4, 6, 2, 8, 3] console.log(numbers.indexOf(2)) // 4 (значение 2 хранится по индексу 4) numbers.findIndex((element) => element === 2) // 4    Скопировать Скопировано Не удалось скопировать   

Кажется, что метод index Of ( ) проще в использовании, и это действительно так, но из-за своей простоты, он уступает методу find Index ( ) в функциональности.

Например, если мы хотим осуществить поиск по массиву объектов, то index Of ( ) вряд ли сможет нам помочь.

 const friends = [ < name: 'Андрей' >, < name: 'Маша' >, ] // Элемент не найденconsole.log( friends.indexOf(< name: 'Артём' >))// -1 console.log( friends.findIndex( (element) => element.name === 'Артём' ))// 2 const friends = [  name: 'Андрей' >,  name: 'Маша' >,  name: 'Артём' > ] // Элемент не найден console.log( friends.indexOf( name: 'Артём' >) ) // -1 console.log( friends.findIndex( (element) => element.name === 'Артём' ) ) // 2    Скопировать Скопировано Не удалось скопировать   

Дело в том, что переменная не хранит в себе содержимое объекта, она содержит только ссылку на него. Следовательно, index Of ( ) сравнивает ссылки, а не сами объекты.

 // ссылка на объект 1let tomato = // ссылка на объект 2let strawberry = // ссылка на объект 1 let tomato =  color: 'red' > // ссылка на объект 2 let strawberry =  color: 'red' >    Скопировать Скопировано Не удалось скопировать   

Сравнение этих двух объектов вернёт false несмотря на то, что значения ключей объектов одинаковы. Это происходит, потому что сравниваются ссылки на объекты:

 console.log(tomato === strawberry);// false console.log(tomato === tomato)// true console.log(tomato === strawberry); // false console.log(tomato === tomato) // true    Скопировать Скопировано Не удалось скопировать   

Array.prototype.indexOf()

Метод indexOf() возвращает первый индекс, по которому данный элемент может быть найден в массиве или -1, если такого индекса нет.

Синтаксис

arr.indexOf(searchElement[, fromIndex = 0])

Параметры

Искомый элемент в массиве.

Индекс, с которого начинать поиск. Если индекс больше или равен длине массива, возвращается -1, что означает, что массив даже не просматривается. Если индекс является отрицательным числом, он трактуется как смещение с конца массива. Обратите внимание: если индекс отрицателен, массив всё равно просматривается от начала к концу. Если рассчитанный индекс оказывается меньше 0, поиск ведётся по всему массиву. Значение по умолчанию равно 0, что означает, что просматривается весь массив.

Описание

Метод indexOf() сравнивает искомый элемент searchElement с элементами в массиве, используя строгое сравнение (en-US) (тот же метод используется оператором === , тройное равно).

Примеры

Пример: использование indexOf()

В следующем примере indexOf() используется для поиска значений в массиве.

var array = [2, 5, 9]; array.indexOf(2); // 0 array.indexOf(7); // -1 array.indexOf(9, 2); // 2 array.indexOf(2, -1); // -1 array.indexOf(2, -3); // 0 

Пример: нахождение всех вхождений элемента

В следующем примере indexOf() используется для поиска всех индексов элемента в указанном массиве, которые с помощью push() добавляются в другой массив.

var indices = []; var array = ["a", "b", "a", "c", "a", "d"]; var element = "a"; var idx = array.indexOf(element); while (idx != -1)  indices.push(idx); idx = array.indexOf(element, idx + 1); > console.log(indices); // [0, 2, 4] 

Полифил

Метод indexOf() был добавлен к стандарту ECMA-262 в 5-м издании; поэтому он может отсутствовать в других реализациях стандарта. Вы можете работать с ним, добавив следующий код в начало ваших скриптов, он позволяет использовать indexOf() в реализациях, которые не поддерживают этот метод. Этот алгоритм является точно тем, что описан в ECMA-262 5-го издания; он предполагает, что TypeError и Math.abs() имеют свои первоначальные значения.

// Шаги алгоритма ECMA-262, 5-е издание, 15.4.4.14 // Ссылка (en): http://es5.github.io/#x15.4.4.14 // Ссылка (ru): http://es5.javascript.ru/x15.4.html#x15.4.4.14 if (!Array.prototype.indexOf)  Array.prototype.indexOf = function (searchElement, fromIndex)  var k; // 1. Положим O равным результату вызова ToObject с передачей ему // значения this в качестве аргумента. if (this == null)  throw new TypeError('"this" is null or not defined'); > var O = Object(this); // 2. Положим lenValue равным результату вызова внутреннего метода Get // объекта O с аргументом "length". // 3. Положим len равным ToUint32(lenValue). var len = O.length >>> 0; // 4. Если len равен 0, вернём -1. if (len === 0)  return -1; > // 5. Если был передан аргумент fromIndex, положим n равным // ToInteger(fromIndex); иначе положим n равным 0. var n = +fromIndex || 0; if (Math.abs(n) === Infinity)  n = 0; > // 6. Если n >= len, вернём -1. if (n >= len)  return -1; > // 7. Если n >= 0, положим k равным n. // 8. Иначе, n // Если k меньше нуля 0, положим k равным 0. k = Math.max(n >= 0 ? n : len - Math.abs(n), 0); // 9. Пока k < len, будем повторятьwhile (k  len)  // a. Положим Pk равным ToString(k). // Это неявное преобразование для левостороннего операнда в операторе in // b. Положим kPresent равным результату вызова внутреннего метода // HasProperty объекта O с аргументом Pk. // Этот шаг может быть объединён с шагом c // c. Если kPresent равен true, выполним // i. Положим elementK равным результату вызова внутреннего метода Get // объекта O с аргументом ToString(k). // ii. Положим same равным результату применения // Алгоритма строгого сравнения на равенство между // searchElement и elementK. // iii. Если same равен true, вернём k. if (k in O && O[k] === searchElement)  return k; > k++; > return -1; >; > 

Спецификации

Specification
ECMAScript Language Specification # sec-array.prototype.indexof

Совместимость с браузерами

BCD tables only load in the browser

Смотрите также

• Array.prototype.lastIndexOf()
• TypedArray.prototype.indexOf() (en-US)

Вывести индекс элемента из массива с объектами

Из этого массива мне нужно получить индекс, например, Лимона. Как осуществить поиск по этому массиву? Array.prototype.indexOf() я так понял не подходит?

Отслеживать
задан 5 мая 2015 в 5:37
3 1 1 золотой знак 1 1 серебряный знак 4 4 бронзовых знака

4 ответа 4

Сортировка: Сброс на вариант по умолчанию

var i; for (i = 0; i < fruits.length; i++) if (fruits[i].name == search) alert(i); 

Отслеживать
ответ дан 5 мая 2015 в 5:49
319 2 2 серебряных знака 16 16 бронзовых знаков

Можно просто через цикл

function findElement(arr, sing) < for(var i = 0; i < arr.length; i++) < var element = arr[i]; for(prop in element ) < if(element[prop] == sing) return i>> return -1; // если ничего не нашли > 

Отслеживать
ответ дан 5 мая 2015 в 5:45
12.2k 1 1 золотой знак 21 21 серебряный знак 40 40 бронзовых знаков

Вот еще такой вариант.

var matrixArr = []; function foobar(searchValue) < for (var i = 3; i >-1; i--)< k = matrixArr[i].indexOf(+searchValue); if (k >= 0) < return (i, k); >> > 

Отслеживать
ответ дан 22 авг 2018 в 12:17
1 2 2 бронзовых знака
Можете пояснить ваше решение?
– user218976
22 авг 2018 в 12:32

Да. Это частный случай для массива 4х4. (var matrixArr = [[. ], [. ], [. ], [. ]];) Поиск идет с конца массива. for (var i = 3; i > -1; i--)< - тут мы задаем номер массива с массивом. k = matrixArr[i].indexOf(+searchValue); - тут происходит поиск заданного числа +searchValue. Если .indexOf возвращает число более -1 - это наше искомое. Следующей строкой выводим его.

как найти индекс элемента массива js

Для поиска индекса элемента массива существует метод indexOf() . Этот метод возвращает первый индекс, по которому элемент может быть найден в массиве. Если элемент отсутствует в массиве, то возвращается -1.

const letters = ['a', 'b', 'b', 'c', 'd', 'e']; console.log(letters.indexOf('a')); // => 0 console.log(letters.indexOf('b')); // => 1 console.log(letters.indexOf('e')); // => 5 console.log(letters.indexOf('z')); // => -1