Filter у масиві

JavaScriptMiddle~1 хв читання

Метод filter() - один із найкорисніших методів масиву в JavaScript. Він використовується, щоб відфільтрувати елементи за певною умовою, створюючи новий масив лише з тих елементів, для яких умова повернула true.

Синтаксис

javascript

const newArray = array.filter((element, index, array) => {
  return умова; // true -> елемент залишається, false -> виключається
});

Параметри колбека:

Аргумент	Опис
`element`	Поточний елемент масиву
`index`	Індекс поточного елемента
`array`	Сам вихідний масив

Приклад 1. Фільтрація чисел

javascript

const numbers = [1, 2, 3, 4, 5, 6];
const even = numbers.filter(num => num % 2 === 0);

console.log(even); // [2, 4, 6]
console.log(numbers); // [1, 2, 3, 4, 5, 6] - вихідний масив не змінився

filter() перевіряє кожен елемент, і якщо умова true, включає його в результат.

Приклад 2. Фільтрація за властивістю об'єкта

javascript

const users = [
  { name: 'Tim', age: 25 },
  { name: 'Alex', age: 17 },
  { name: 'John', age: 30 }
];

const adults = users.filter(user => user.age >= 18);

console.log(adults);
// [
//   { name: 'Tim', age: 25 },
//   { name: 'John', age: 30 }
// ]

Частий сценарій - відбір користувачів, товарів, записів тощо за умовою.

Приклад 3. Видалення "порожніх" значень

javascript

const values = [0, null, '', 'Hello', undefined, 42];
const truthy = values.filter(Boolean);

console.log(truthy); // ['Hello', 42]

Передача Boolean як функції автоматично відфільтровує "хибні" (falsy) значення.

Часті помилки

Відсутність return у фігурних дужках:

javascript

const result = arr.filter(num => { num > 5 }); // undefined

Правильно:

javascript

const result = arr.filter(num => num > 5);
// або
const result = arr.filter(num => { return num > 5 });

Спроба змінити елементи всередині filter:

filter() не призначений для зміни - лише для відбору. Для перетворень використовуй map().

Коли використовувати filter()

Ціль	Чи підходить `filter()`
Відібрати елементи за умовою	Так
Перетворити значення	Ні - використовуй `map()`
Знайти один елемент	Ні - використовуй `find()`
Змінити вихідний масив	Ні - `filter` повертає новий масив

Коротко:

filter() - повертає новий масив з елементами, що пройшли перевірку.

Формула запам'ятовування: arr.filter(умова) -> новий_масив_підмножина.

Різниця між map() і filter()

Метод	Що робить	Розмір нового масиву
map()	Перетворює кожен елемент	Завжди однаковий
filter()	Відбирає елементи за умовою	Може бути менший

Коротка відповідь

Для співбесіди

Premium

Коротка відповідь допоможе вам впевнено відповідати на цю тему під час співбесіди.