Какая лучшая практика для фильтрации данных по нескольким значениям?

Question

[antpv]

Допустим у нас есть объект, который просто хранит значения чекбоксов и соответственно обновляется каждый раз при изменении какого-либо чекбокса:

let state = {
  's': false,
  'm': false,
  'l': false
} //для абстракции, s / m / l - размеры одежды

У нас так же есть массив объектов с одеждой, размер указан в свойстве size

[...{
value: ...,

<b>size: 's'</b>

value: ...
}...]

Каждый раз при изменении чекбокса, мы попадаем во внутрь функции filterItems.

С вводными данными закончил, тепер вопросы. Какая лучшая практика/алгоритм/паттерн для сортировки item`ов по значениям чекбоксов (в данном случае)?

Вот как я описал функцию (если лень вникать, код в двух словах описал ниже):

function filterItems() {
  let filtered = [];

  filtered = filtered.concat(items.filter((item) => {
    if (state['s'] && item.size === 's') {
        return item;
    }
  }))
  
  filtered = filtered.concat(items.filter((item) => {
    if (state['m'] && item.size === 'm') {
        return item;
    }
  }))
  
  filtered = filtered.concat(items.filter((item) => {
    if (state['l'] && item.size === 'l') {
        return item;
    }
  }))

  return filtered;
}

Создан пустой массив куда войдут отфильтрованные объекты.
Я использую по условию для каждого чекбокса, если чекбокс включен (напрмер по размеру s) - мы фильтруем массив, и все вещи с размером s попадают в новый массив.
И так для каждого размера, после чего возвращаю этот новый массив.

Как сделать правильно? имеет ли право на жизнь мой подход?
Просто ничего лучше не придумал

Answer 1

[0xD34F]

Как-то уж очень громоздко выглядит. Если я правильно понял, то то, что вам нужно, делается куда проще:

const filterItems = () => items.filter(n => state[n.size]);

Answer 2

[Stalker_RED]

Это называется фасетный поиск. Есть готовые библиотеки и фреймворки.