How do I filter such array:
const recipes = [
{
"id": 1,
"name": "Boiled Egg",
"ingredients": [
"egg",
"water"
],
},
{
"id": 2,
"name": "Pancakes",
"ingredients": [
"egg",
"milk",
"flour"
],
},
{
"id": 3,
"name": "Bread",
"ingredients": [
"flour",
"water",
"salt"
],
},
]
based on elements in such array
const selectedIngredients = ["milk", "salt"]
I played with combination of array.filter, array.some as show in Check if an array contains any element of another array in JavaScript but can't get it working properly
I want to get recipes with id 2 and 3 as a result
You can set the condition of the filter to whether selectedIngredients includes an item that is included in the item's ingredients property:
const recipes=[{id:1,name:"Boiled Egg",ingredients:["egg","water"]},{id:2,name:"Pancakes",ingredients:["egg","milk","flour"]},{id:3,name:"Bread",ingredients:["flour","water","salt"]}];
const selectedIngredients = ["milk", "salt"]
const result = !selectedIngredients.length ? [...recipes] : recipes.filter(e => selectedIngredients.some(f => e.ingredients.includes(f)))
console.log(result)const recipes = [
{
"id": 1,
"name": "Boiled Egg",
"ingredients": [
"egg",
"water"
],
},
{
"id": 2,
"name": "Pancakes",
"ingredients": [
"egg",
"milk",
"flour"
],
},
{
"id": 3,
"name": "Bread",
"ingredients": [
"flour",
"water",
"salt"
],
},
]
const selectedIngredients = ["flour", "water"]
const selectAny = (list, filter) =>
list.filter(e => e.ingredients.some(i => filter.includes(i)));
const selectAll = (list, filter) =>
list.filter(e => filter.every(i => e.ingredients.includes(i)));
console.log('any', selectAny(recipes, selectedIngredients));
console.log('all', selectAll(recipes, selectedIngredients));I would do it like this
const recipes = [
{
id: 1,
name: 'Boiled Egg',
ingredients: ['egg', 'water'],
},
{
id: 2,
name: 'Pancakes',
ingredients: ['egg', 'milk', 'flour'],
},
{
id: 3,
name: 'Bread',
ingredients: ['flour', 'water', 'salt'],
},
];
//
const doRebuild = (selectedIngredients)=>{
const build = [];
for(const two of selectedIngredients){
for(const one of recipes){
if(one.ingredients.some((a)=>two === a))build.push(one);
}
}
return build.length > 0 ? build : ['No recipes'];
};
//
const content1 = doRebuild(['milk2', 'salt2']);
const content2 = doRebuild(['milk', 'salt']);
console.log(content1);
console.log(content2);