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

Array.prototype.find()

Метод find() возвращает значение первого найденного в массиве элемента, которое удовлетворяет условию переданному в callback функции. В противном случае возвращается undefined .

Также смотрите метод findIndex() , который возвращает индекс найденного в массиве элемента вместо его значения.

Если вам нужно найти позицию элемента или наличие элемента в массиве, используйте Array.prototype.indexOf() или Array.prototype.includes() соответственно.

Синтаксис

arr.find(callback[, thisArg])

Параметры

Функция, вызывающаяся для каждого значения в массиве, принимает три аргумента:

Текущий обрабатываемый элемент в массиве.

Индекс текущего обрабатываемого элемента в массиве.

Массив, по которому осуществляется проход.

Необязательный параметр. Значение, используемое в качестве this при выполнении функции callback .

Возвращаемое значение

Значение элемента из массива, если элемент прошёл проверку, иначе undefined .

Описание

Метод find вызывает переданную функцию callback один раз для каждого элемента, присутствующего в массиве, до тех пор, пока она не вернёт true . Если такой элемент найден, метод find немедленно вернёт значение этого элемента. В противном случае, метод find вернёт undefined . До Firefox 34 функция callback не вызывалась для «дырок» в массивах (bug 1058394).

Функция callback вызывается с тремя аргументами: значением элемента, индексом элемента и массивом, по которому осуществляется проход.

Если в метод find был передан параметр thisArg , при вызове callback он будет использоваться в качестве значения this . В противном случае в качестве значения this будет использоваться значение undefined .

Метод find не изменяет массив, для которого он был вызван.

Диапазон элементов, обрабатываемых методом find , устанавливается до первого вызова функции callback . Элементы, добавленные в массив после начала выполнения метода find , не будут посещены функцией callback . Если существующие, непосещение элементы массива изменяются функцией callback , их значения, переданные в функцию, будут значениями на тот момент времени когда метод find посетит их; удалённые элементы все ещё будут посещены.

Примеры

Пример: поиск простого числа в массиве

Следующий пример находит в массиве положительных чисел элемент, являющийся простым числом (либо возвращает undefined , если в массиве нет простых чисел).

function isPrime(element, index, array)  var start = 2; while (start  Math.sqrt(element))  if (element % start++  1)  return false; > > return element > 1; > console.log([4, 6, 8, 12].find(isPrime)); // undefined, не найдено console.log([4, 5, 8, 12].find(isPrime)); // 5

Полифил

Этот метод был добавлен в спецификации ECMAScript 6 и пока может быть недоступен во всех реализациях JavaScript. Однако, вы можете использовать следующий сниппет в качестве полифила:

// https://tc39.github.io/ecma262/#sec-array.prototype.find if (!Array.prototype.find) < Object.defineProperty(Array.prototype, 'find', < value: function(predicate) < // 1. Let O be ? ToObject(this value). if (this == null) < throw new TypeError('"this" is null or not defined'); >var o = Object(this); // 2. Let len be ? ToLength(? Get(O, "length")). var len = o.length >>> 0; // 3. If IsCallable(predicate) is false, throw a TypeError exception. if (typeof predicate !== 'function') < throw new TypeError('predicate must be a function'); >// 4. If thisArg was supplied, let T be thisArg; else let T be undefined. var thisArg = arguments[1]; // 5. Let k be 0. var k = 0; // 6. Repeat, while k < len while (k < len) < // a. Let Pk be ! ToString(k). // b. Let kValue be ? Get(O, Pk). // c. Let testResult be ToBoolean(? Call(predicate, T, « kValue, k, O »)). // d. If testResult is true, return kValue. var kValue = o[k]; if (predicate.call(thisArg, kValue, k, o)) < return kValue; >// e. Increase k by 1. k++; > // 7. Return undefined. return undefined; >, configurable: true, writable: true >); >

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

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

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

BCD tables only load in the browser

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

Array.prototype.findIndex() Экспериментальная возможность
Array.prototype.every()

Found a content problem with this page?

Edit the page on GitHub.
Report the content issue.
View the source on GitHub.

This page was last modified on 4 авг. 2023 г. by MDN contributors.

Your blueprint for a better internet.

Поиск элементов в массиве JavaScript

Для поиска по массиву в JavaScript существует несколько методов прототипа Array, не считая что поиск можно выполнить и методами для перебора массива и в обычном цикле.

Итак, мы сегодня рассмотрим следующие варианты:

Array.includes()
Array.indexOf()
Array.find()
Array.findIndex()
Array.filter()
Array.forEach()

Array.includes() — есть ли элемент в массиве

Данный метод ищет заданный элемент и возвращает true или false , в зависимости от результата поиска. Принимает два параметра:

element — то, что мы будем искать
fromIndex (необязательный) — с какого индекса начинать поиск. По умолчанию с 0.

const arr = ['Apple', 'Orange', 'Lemon', 'Cherry']; console.log(arr.includes('Apple')); // true console.log(arr.includes('Apple', 1)); // false

Как видно из примера выше, в первом случае мы получим true , т.к. начали с нулевого элемента массива. Во втором случае мы передали второй параметр — индекс, с которого нужно начать поиск — и получили false , т.к. дальше элемент не был найден.

Array.indexOf() — индекс элемента в массиве

Данный метод, в отличие от предыдущего, возвращает индекс первого найденного совпадения. В случае если элемент не найден, будет возвращено число -1

Также принимает два параметра:

element — элемент, который мы будем искать
fromIndex (необязательный) — с какого индекса начинать поиск. По умолчанию с 0.

const arr = ['Apple', 'Orange', 'Lemon', 'Cherry', 'Apple']; console.log(arr.indexOf('Apple')); // 0 console.log(arr.indexOf('Apple', 1)); // 4 console.log(arr.indexOf('Orange', 2)); // -1

Как видно из примера выше, в первом случае мы получаем 0, т.к. сразу нашли первый элемент массива (первое совпадение, дальше поиск уже не выполняется). Во втором случае 4, т.к. начали поиск с индекса 1 и нашли следующее совпадение. В третьем примере мы получили результат -1, т.к. поиск начали с индекса 2, а элемент Orange в нашем массиве под индексом 1.

Так как данный метод возвращает индекс или -1, мы можем присвоить результат в переменную для дальнейшего использования:

const arr = ['Apple', 'Orange', 'Lemon', 'Cherry', 'Apple']; const index = arr.indexOf('Lemon'); if (index !== -1) < // сделать что-то >

Чтобы произвести какие-то действия над найденным элементом массива, мы можем использовать следующий синтаксис:

const arr = ['Apple', 'Orange', 'Lemon', 'Cherry', 'Apple']; const index = arr.indexOf('Lemon'); arr[index] = 'Lime'; // заменяем найденный элемент console.log(arr)ж // ['Apple', 'Orange', 'Lime', 'Cherry', 'Apple']

Примеры использования данного метода вы можете также найти в посте про удаление элемента из массива

Array.find() — найти элемент по условию

Данный метод callback и thisArg в качестве аргументов и возвращает первое найденное значение.

Callback принимает несколько аргументов:
item — текущий элемент массива
index — индекс текущего элемента
currentArray — итерируемый массив

const arr = ['Apple', 'Orange', 'Lemon', 'Cherry', 'Apple']; const apple = arr.find(item => item === 'Apple'); console.log(apple); // Apple

Данный метод полезен тем, что мы можем найти и получить сразу и искомый элемент, и его index

const arr = ['Apple', 'Orange', 'Lemon', 'Cherry', 'Apple']; let indexOfEl; const apple = arr.find((item, index) => < if (item === 'Apple') < indexOfEl = index; return item; >>); console.log(apple, indexOfEl); // Apple 0

Также работа кода прекратиться как только будет найден нужный элемент и второй элемент (дубликат) не будет найден.

В случае если ничего не найдено будет возвращен undefined .

Array.findIndex() — найти индекс элемента в массиве

Этот метод похож на метод find() , но возвращать будет только индекс элемента, который соответствует требованию. В случае, если ничего не найдено, вернет -1

const arr = ['Apple', 'Orange', 'Lemon', 'Cherry', 'Apple']; const index = arr.findIndex(item => item === 'Apple'); console.log(index); // 0

Ну и по аналогии с предыдущим методом, поиск завершается после первого совпадения.

Поиск всех совпадений в массиве

Метод filter() кроме всего остального также можно использовать для поиска по массиву. Предыдущие методы останавливаются при первом соответствии поиска, а данный метод пройдется по массиву до конца и найдет все элементы. Но данный метод вернет новый массив, в который войдут все элементы соответствующие условию.

const arr = ['Apple', 'Orange', 'Lemon', 'Cherry', 'Apple']; const filteredArr = arr.filter(item => item === 'Apple'); console.log(filteredArr); // ['Apple', 'Apple'] console.log(arr); // ['Apple', 'Orange', 'Lemon', 'Cherry', 'Apple'];

Как видите из примера выше, первоначальный массив не будет изменен.

Подробнее про метод JS filter() можете прочитать в этом посте.

Для этих же целей можно использовать метод forEach(), который предназначен для перебора по массиву:

const arr = ['Apple', 'Orange', 'Lemon', 'Cherry', 'Apple']; let indexes = []; arr.forEach((item, index) => < if (item === 'Apple') indexes.push(index) >); console.log(indexes); // [0, 4]

В массив indexes мы получили индексы найденных элементов, это 0 и 4 элементы. Также в зависимости от вашей необходимости, можно создать объект, где ключом будет индекс, а значением сам элемент:

const arr = ['Apple', 'Orange', 'Lemon', 'Cherry', 'Apple']; let arrObjMap = <>; arr.forEach((item, index) => < if (item === 'Apple') < arrObjMap[index] = item; >>); console.log(arrObjMap); //

Поиск в массиве объектов

Если у вас массив состоит не из примитивных типов данных, а к примеру, каждый элемент это объект со своими свойствами и значениями, тогда можно использовать следующие варианты для получения индекса элемента.

Первый способ. С использованием метода map для массива

const arr = [ < name: 'Ben', age: 21 >, < name: 'Clif', age: 22 >, < name: 'Eric', age: 18 >, < name: 'Anna', age: 27 >, ]; const index = arr.map(item => item.name).indexOf('Anna'); console.log(index); //3 console.log(arr[index]); //

В данном случае по массиву arr мы проходим и на каждой итерации из текущего элемента (а это объект со свойствами name и age ) возвращаем имя человека в новый массив и сразу же выполняем поиск по новому массиву на имя Anna. При совпадении нам будет возвращен индекс искомого элемента в массиве.

Второй способ. Данный вариант будет немного проще, т.к. мы можем сразу получить индекс при совпадении:

const index = arr.findIndex(item => item.name === 'Anna'); console.log(index); //3 console.log(arr[index]); //

Заключение

Как видите любой из вышеприведенных методов можно использовать для поиска по массиву. Какой из них использовать зависит от вашей задачи и того, что вам нужно получить — сам элемент или его индекс в массиве, найти только первое совпадение или все совпадения при поиске.

Ваши вопросы и комментарии:

как найти индекс элемента массива 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