фильтровать число раз на массиве

Question

Я хочу воссоздать фильтры, которые есть в интернет-магазинах, если кто-то хочет выбрать, говорит «футболки» и «зеленый». ясно, что это легко. Однако, если они выбирают несколько цветов, как я могу это сделать?

Я знаю, что могу соединиться так: colors.filter(col => col.name =='green' || col.name =='black'), но что, если я хочу выбрать 10 цветов или 20, это в настоящее время не очень масштабируемо. Можно ли каким-то образом нанести на карту цвета, а затем отфильтровать?

Я попробовал это, но это не сработало:

colors = ['black', 'red']
col = [{name: 'green'}, {name: 'black'}, {name: 'red'}]
colors.forEach((c) => col.filter((ca) => ca.name === c))`

Answer 1

Вы должны использовать фильтр и включает

const colors = ['black', 'red']
const col = [{name: 'green'}, {name: 'black'}, {name: 'red'}]
let filtered = col.filter(ca => colors.includes(ca.name))
console.log(filtered)

Answer 2

Вы можете использовать array.includes:

colors = ['black', 'red']
cols = [{name: 'green'}, {name: 'black'}, {name: 'red'}];

var filtered = cols.filter(c => colors.includes(c.name));
console.log(filtered);

Answer 3

Вы можете просто использовать Set:

let filterColors = new Set();
filterColors.add('green');
filterColors.add('black');

colors.filter(col => filterColors.has(col.name));

Answer 4

Вы можете создать новый массив для вашего окончательного результата с именем selectedColor, чтобы объекты выдвигались с соответствующим цветом.

colors = ['black', 'red'];
col = [{name: 'green'}, {name: 'black'}, {name: 'red'}];
var selectedColor = [];
colors.forEach((c) => col.filter((ca) => {
   if(ca.name === c){
     selectedColor.push(ca);
   }
}));
console.log(selectedColor);

ИСПОЛЬЗОВАНИЕ indexOf ()

colors = ['black', 'red']
col = [{name: 'green'}, {name: 'black'}, {name: 'red'}]
var selected = col.filter(prod => colors.indexOf(prod.name) !== -1)
console.log(selected);

Использование indexOf() настоятельно рекомендуется, поскольку includes() не работают в браузерах IE.

Answer 5

Если они выбирают несколько цветов, как я могу это сделать?

Вы можете использовать includes() или indexOf() методы.

colors = ['black', 'red']
col = [{name: 'green'}, {name: 'black'}, {name: 'red'}]
var selected = col.filter(prod => colors.includes(prod.name))
console.log(selected);