Фильтр данных в массиве исользуется довольно часто. Наиболее фастые примеры это:
- фильтр товаров в интернет магазине по заданым критериям
- переход по категорям тоже осуществляется с помощью фитльтра
- удаление товара из корзины - это тоже фильтр

[↓ Посмотреть видео-пример ↓](#watch-now)

## Как работает фильтр в JS

Метод фильтр можно применять к любым массивам в JS. Создатели языка заимплементили основную логику, а саму логику сравнения авбстрагировали и оставили нам. Что прекрасно, ведь массивы могут хранить что угодно! И не знаю как вас, но меня в школе учили, на математике, что груши с яблоками нельзя сравнивать.
Что это значит? Что мы должны передать эту логику сравнения в фильтр. Давайте добавим фильтр для чисел, и оставим только те что делятся на 3.

    // index.js

    const nums = [1, 2, 3, 4, 5, 6, 7, 8, 9];

    const disionOf3 = nums.filter(it=> it%3 === 0);
    console.log(disionOf3); // [3, 6, 9]

Как видете мы создали массив с числами, применили метод `filter` и в него мы передали функцию (это стрелочная функция, или лямбда, но можно и обычную передать). Функция принимает один аргумент - он будет играть роль элемента массива. А возвращать `true` или `false`. Если правда - элемент остаеться в массиве, нет - удаляется. 

Так же не стоит забывать что метод фильтр не модифицирует оригинальный массив, а возвращает новый, элементы которого соответствует заданному условию.

## Пример с массивом обьектов

    // index.js

    const friends = [
      {
        name: "Sasha", 
        age: 30
      },
      {
        name: "Jack",
        age: 35
      },
      {
        name: "Tom",
        age: 12
      }]

      const canDrinkBeer = friends.filter(it => it.age > 18);
      console.log(canDrinkBeer)

### Watch Now


Когда применяется фильтр массива

Фильтр обьектов в массиве React за 5 минут

Red LED filter of 0 and 1 with outcome of only zeros

Filtering

Как наладить фильтр обьектов в React с помощью JS

Примеры и разбор кода для фильтрации массивов с числами и объектами. Копируй код и смотри видео урок чтобы не пропустить ни одной детали.

OB Web Dev

OB Web Dev

Фильтр данных в массиве в JS/React

Фильтр данных в массиве в JS/React

Получить скидку на курс основы WebDev