.find ( )
Поиск по массиву будет искать по тем критериям, которые вы придумали.
Кратко
Скопировать ссылку «Кратко» Скопировано
Метод массива find ( ) вернёт первый найденный в массиве элемент, который подходит под условие в переданной колбэк-функции. Если в массиве не найдётся ни одного подходящего элемента, то вернётся значение undefined .
Пример
Скопировать ссылку «Пример» Скопировано
Опишем функцию, которая позволит определить, есть ли в списке дел моё любимое занятие. Поставим в константу просмотр сериальчиков и будем проверять: если занятие из ToDo-списка совпадает с моим хобби, то вернём его. В списке дел на завтра нет просмотра сериалов, а значит, вернётся undefined .
function isMyFavoriteHobby(element, index, array) const myFavoriteHobby = 'смотреть сериальчики' return element === myFavoriteHobby> const currentToDoList = [ 'смотреть сериальчики', 'читать книгу', 'пить кофе', 'гладить кота', 'гулять',]const tomorrowToDoList = [ 'читать книгу', 'пить кофе', 'гладить кота', 'гулять',] console.log(currentToDoList.find(isMyFavoriteHobby))// 'смотреть сериальчики' console.log(tomorrowToDoList.find(isMyFavoriteHobby))// undefined, не найденоfunction isMyFavoriteHobby(element, index, array) const myFavoriteHobby = 'смотреть сериальчики' return element === myFavoriteHobby > const currentToDoList = [ 'смотреть сериальчики', 'читать книгу', 'пить кофе', 'гладить кота', 'гулять', ] const tomorrowToDoList = [ 'читать книгу', 'пить кофе', 'гладить кота', 'гулять', ] console.log(currentToDoList.find(isMyFavoriteHobby)) // 'смотреть сериальчики' console.log(tomorrowToDoList.find(isMyFavoriteHobby)) // undefined, не найдено
Интерактивный пример
Скопировать ссылку «Интерактивный пример» Скопировано
Как пишется
Скопировать ссылку «Как пишется» Скопировано
В метод find ( ) необходимо передать аргументом функцию. Функция должна возвращать булевое значение true или false . find ( ) вернёт первый элемент, на котором переданная функция-колбэк вернула true .
Чтобы получить необходимый элемент, нужно определить условие поиска. В этом нам поможет функция-предикат. Предикат — это функция, которая возвращает булевое значение.
От результата выполнения функции зависит, вернёт ли find ( ) подходящий элемент:
Опишем функцию-предикат is Odd , которая проверяет, является ли число нечётным: проверим остаток от деления на 2, и если остаток равен 1, то число нечётное:
const isOdd = (element) => return element % 2 === 1;>const isOdd = (element) => return element % 2 === 1; >
Протестируем функцию на двух наборах данных. Первый набор состоит только из чётных значений. Второй массив включает в себя нечётные значения: 17, 19, 21.
Когда мы запустим метод find ( ) у первого массива, то нам вернётся undefined , так как ни одно значение не подходит под условие. В случае со вторым набором вернётся число 17 и только оно, потому что это число первое удовлетворило значению.
const onlyEvenElements = [2, 4, 8, 16, 32]const withOddElements = [2, 4, 8, 16, 17, 19, 21] console.log(onlyEvenElements.find(isOdd))// undefined, не найдено console.log(withOddElements.find(isOdd))// 17const onlyEvenElements = [2, 4, 8, 16, 32] const withOddElements = [2, 4, 8, 16, 17, 19, 21] console.log(onlyEvenElements.find(isOdd)) // undefined, не найдено console.log(withOddElements.find(isOdd)) // 17
Функция, которую мы передаём в метод find , принимает три параметра:
- element — элемент массива в текущей итерации;
- index — индекс текущего элемента;
- arr — сам массив, который перебираем.
В коде is Odd мы не стали объявлять параметры index и arr , потому что не используем их.
Как понять
Скопировать ссылку «Как понять» Скопировано
Метод find ( ) возвращает элемент, который соответствует описанному в функции-предикате условию. Реализовать такую логику можно и через for , но метод find ( ) позволяет это сделать проще.
Ниже показан пример того, как решить задачу без find ( ) . Если мы уберём число 2 из массива, то функция будет возвращать undefined .
const numbersWithTwo = [1, 2, 3, 4, 5, 6]const numbersWithoutTwo = [1, 3, 4, 5, 6] const findTwo = (array) => for (let i = 0; i < array.length; i++) if (array[i] === 2) return array[i] > > return undefined>; console.log(findTwo(numbersWithTwo))// 2 console.log(findTwo(numbersWithoutTwo))// undefinedconst numbersWithTwo = [1, 2, 3, 4, 5, 6] const numbersWithoutTwo = [1, 3, 4, 5, 6] const findTwo = (array) => for (let i = 0; i array.length; i++) if (array[i] === 2) return array[i] > > return undefined >; console.log(findTwo(numbersWithTwo)) // 2 console.log(findTwo(numbersWithoutTwo)) // undefined
☝️ Обратите внимание: после того, как нужный элемент был найден, из функции find Two возвращается значение. Это ведёт к прерыванию цикла for . Мы сделали так, чтобы полностью симулировать работу метода find ( ) — он заканчивает работу сразу, как только нашёл нужный элемент. Это называется оптимизация. Не стоит тратить ресурс на то, что уже сделано и не пригодится в дальнейшем.
find ( ) позволит писать меньше кода и сделать его более понятным:
const numbers = [1, 2, 3, 4, 5, 6] const result = numbers.find(function isElementEquals2(element) return element === 2>); console.log(result)// 2const numbers = [1, 2, 3, 4, 5, 6] const result = numbers.find(function isElementEquals2(element) return element === 2 >); console.log(result) // 2
Методы .filter ( ) и find ( ) похожи. Главное отличие find ( ) от filter ( ) в том, что find ( ) возвращает первый подходящий элемент, а filter ( ) вернёт массив со всеми подходящими элементами.
Вариант реализации через .filter ( ) :
const isTwoOrFour = (element) => return (element === 2) || (element === 4)> const numbers = [1, 2, 3, 4, 5, 2, 6] const resultWithFilter = numbers.filter(isTwoOrFour(element))const resultWithFind = numbers.find(isTwoOrFour(element)) console.log(resultWithFilter);// [2, 4, 2] console.log(resultWithFind);// 2const isTwoOrFour = (element) => return (element === 2) || (element === 4) > const numbers = [1, 2, 3, 4, 5, 2, 6] const resultWithFilter = numbers.filter(isTwoOrFour(element)) const resultWithFind = numbers.find(isTwoOrFour(element)) console.log(resultWithFilter); // [2, 4, 2] console.log(resultWithFind); // 2
Array.prototype.find()
Метод find() возвращает значение первого найденного в массиве элемента, которое удовлетворяет условию переданному в callback функции. В противном случае возвращается undefined .
Также смотрите метод findIndex() , который возвращает индекс найденного в массиве элемента вместо его значения.
Если вам нужно найти позицию элемента или наличие элемента в массиве, используйте Array.prototype.indexOf() или Array.prototype.includes() соответственно.
Синтаксис
Параметры
Функция, вызывающаяся для каждого значения в массиве, принимает три аргумента:
Текущий обрабатываемый элемент в массиве.
Индекс текущего обрабатываемого элемента в массиве.
Массив, по которому осуществляется проход.
Необязательный параметр. Значение, используемое в качестве 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 >); > Спецификации
Совместимость с браузерами
BCD tables only load in the browser
Смотрите также
Found a content problem with this page?
This page was last modified on 22 окт. 2022 г. by MDN contributors.
Your blueprint for a better internet.