Виталий Котов
Как работает метод find() - JavaScript
Автор
Метод find()
возвращает значение первого элемента массива, который удовлетворяет условиям заданной функции.
let numbers = [1, 3, 4, 9, 8];
// функция проверки четного числа
function isEven(element) {
return element % 2 == 0;
}
// получаем первое четное число
let evenNumber = numbers.find(isEven);
console.log(evenNumber);
// Вывод в консоль: 4
Синтаксис find()
Синтаксис метода find()
следующий:
arr.find(callback(element, index, arr), thisArg);
Где arr
- это массив.
Параметры find()
Метод find()
принимает:
callback
- функцию, которая будет вызываться для каждого элемента массива. Принимает:
element
- текущий элемент в массиве.
- функцию, которая будет вызываться для каждого элемента массива. Принимает:
thisArg
(необязательно) - значение, используемое в качествеthis
, при вызове функцииcallback
.
Возвращаемое значение find()
- Возвращает значение первого элемента массива, удовлетворяющего заданной функции.
- Возвращает
undefined
, если ни один из элементов не удовлетворяет функции.
Примеры
Пример 1: Использование метода find()
function isEven(element) {
return element % 2 == 0;
}
let randomArray = [1, 45, 8, 98, 7];
let firstEven = randomArray.find(isEven);
console.log(firstEven); // 8
// используем стрелочную функцию
let firstOdd = randomArray.find((element) => element % 2 == 1);
console.log(firstOdd); // 1
Вывод в консоль:
8
1
Пример 2: find() с элементами объекта
const team = [
{ name: "Bill", age: 10 },
{ name: "Linus", age: 15 },
{ name: "Alan", age: 20 },
{ name: "Steve", age: 34 },
];
function isAdult(member) {
return member.age >= 18;
}
console.log(team.find(isAdult)); // { name: 'Alan', age: 20 }
// используем стрелочную функцию и деструктуризацию
let adultMember = team.find(({ age }) => age >= 18);
console.log(adultMember); // { name: 'Alan', age: 20 }
Вывод в консоль:
{ name: 'Alan', age: 20 }
{ name: 'Alan', age: 20 }
Постройте личный план изучения Javascript до уровня Middle — бесплатно!
Javascript — часть карты развития Frontend
100+ шагов развития
30 бесплатных лекций
300 бонусных рублей на счет
Бесплатные лекции
Все гайды по Javascript
Как работает метод trim() - JavaScriptКак работает метод toUpperCase() - JavaScriptКак работает метод toLowerCase() - JavaScriptКак работает метод substring() - JavaScriptКак работает метод startsWith() - JavaScriptКак работает метод split() - JavaScriptКак работает метод slice() - JavaScriptКак работает метод search() - JavaScriptКак работает метод replaceAll() - JavaScriptКак работает метод replace() - JavaScriptКак работает метод repeat() - JavaScriptКак работает метод padStart() - JavaScriptКак работает метод padEnd() - JavaScriptКак работает метод matchAll() - JavaScriptКак работает метод match() - JavaScriptКак работает метод localeCompare() - JavaScriptКак работает свойство length - JavaScriptКак работает метод lastIndexOf() - JavaScriptКак работает метод indexOf() - JavaScriptКак работает метод includes() - JavaScriptКак работает метод fromCodePoint() - JavaScriptКак работает метод fromCharCode() - JavaScriptКак работает метод endsWith() - JavaScriptКак работает метод concat() - JavaScriptКак работает метод codePointAt() - JavaScriptКак работает метод charCodeAt() - JavaScriptКак работает метод charAt() - JavaScript
Событие wheel в JavaScriptСобытие unload в JavaScriptСобытие touch в JavaScriptСобытие submit в JavaScriptСобытие scroll в JavaScriptСобытие reset в JavaScriptМетод .preventDefault() в JavaScriptСобытие mouseover в JavaScriptСобытие mouseout в JavaScriptСобытие load в JavaScriptСобытие keyup в JavaScriptСобытие keydown в JavaScriptСобытие invalid в JavaScriptСобытие input в JavaScriptСобытийная модель Event в JavaScriptОбъект события Event в JavaScriptСобытие DOMContentLoaded в JavaScriptСобытие dblclick в JavaScriptСобытие click в JavaScriptСобытие change в JavaScriptСобытие beforeunload в JavaScript
.textContent в JavaScript.style в JavaScript.setProperty() в JavaScript.scrollTo() в JavaScript.scrollIntoView() в JavaScript.scrollBy() в JavaScript.removeProperty() в JavaScript.removeEventListener() в JavaScript.querySelectorAll() в JavaScript.querySelector() в JavaScript.outerHTML в JavaScript.innerText в JavaScriptв JavaScript.hidden в JavaScript.getPropertyValue() в JavaScript.getElementsByTagName() в JavaScript.getElementsByClassName() в JavaScript.getAttribute() в JavaScript.focus() в JavaScriptЭлемент в JavaScript.dataset в JavaScript.closest() в JavaScript.classList в JavaScript.blur() в JavaScript.addEventListener() в JavaScript
Объект WeakSet в JavaScriptОбъект TypedArray в JavaScriptОбъект SharedArrayBuffer в JavaScriptОбъект Set в JavaScriptОбъект в JavaScriptОбъект Map в JavaScriptfunction в JavaScriptОбъект DataView в JavaScriptОбъект WeakMap в JavaScriptОбъект Atomics в JavaScriptМассивы в JavaScriptОбъект ArrayBuffer в JavaScript
window.print() в JavaScriptwindow.open() в JavaScriptwindow.navigator в JavaScriptwindow.location в JavaScriptwindow.history в JavaScriptURLSearchParams в JavaScriptsetTimeout() в JavaScriptsetInterval() в JavaScriptsessionStorage в JavaScriptqueueMicrotask() в JavaScriptprompt() в JavaScriptPerformance в JavaScriptwindow.matchMedia в JavaScriptlocalStorage в JavaScriptGeolocation API в JavaScriptFormData в JavaScriptfetch() в JavaScriptDOM в JavaScriptconsole.log() в JavaScriptconfirm() в JavaScriptclearTimeout() в JavaScriptclearInterval() в JavaScriptalert() в JavaScriptBOM в JavaScript
Как работает метод some() - JavaScriptКак работает метод reverse() - JavaScriptКак работает метод reduce() - JavaScriptКак работает метод map() - JavaScriptКак работает метод isArray() - JavaScriptКак работает метод indexOf() - JavaScriptКак работает метод includes() - JavaScriptКак работает метод from() - JavaScriptКак работает метод forEach() - JavaScriptКак работает метод flatMap() - JavaScriptКак работает метод flat() - JavaScriptКак работает метод findIndex() - JavaScriptКак работает метод find() - JavaScriptКак работает метод filter() - JavaScriptКак работает метод every() - JavaScriptМассивы в JavaScript
Лучшие курсы по теме

Основы JavaScript
Антон ЛаричевBackend
Frontend
Mobile
3 999 ₽Бесплатный старт

TypeScript с нуля
Антон ЛаричевBackend
Frontend
Mobile
3 999 ₽Бесплатный старт

Next.js - с нуля
Антон ЛаричевFrontend
3 999 ₽Бесплатный старт