Finding compatibility between two arrays with flexibility

Question

Finding compatibility between two arrays with flexibility

I am currently working on an Ionic app that involves an array of ingredients and a service with recipes. You can find the structure of the recipe service here.

My goal is to match the ingredients with the recipes. Currently, I have implemented the following logic:

 
 this.truelist = [...this.spliterStrIngredients()]; // an array of ingredients
 const  nbIngredients = this.truelist.length;

 console.log('true list = ' + this.truelist);
 let match = 0 ;
 this.recipeList.forEach((key => {
     key.ingreds.forEach(ingrRecipe => {
         this.truelist.forEach((ingrSelct , index) => {
            if (ingrSelct === ingrRecipe)
            {
                match ++;
            }
            if (match >= this.truelist.length ) {
                this.recipeMatch.push(key.name);
                match = 0;
            }
         });
     });

 }));
 console.log(this.recipeMatch);
}

While this method works when selecting the exact recipe, I am looking to make it more flexible. For instance, I would like to be able to match an array of ingredients like pasta+cheese+carrots with a recipe like carbonara.

Any help or suggestions on how to achieve this flexibility would be greatly appreciated.

javascript angular typescript ionic-framework types

Answer 1

Answer №1

Based on the guidelines provided, here is a tailored solution that meets your requirements:

const recipeList = [{
    name: 'Carbonara',
    picFile: '',
    ingreds: ['Pasta', 'Cheese', 'Egg'],
    description: ['1', '2', '3']
}];

const myIngredientsA = ['Pasta', 'Cheese'];
const myIngredientsB = ['Pasta', 'Cheese', 'Egg'];
const myIngredientsC = ['Pasta', 'Cheese', 'Egg', 'Bacon'];

function discoverMatchingRecipe(myIngredientsList: string[]) {
    let count = 0;
    let recipeMatch: any[] = [];

    recipeList.forEach(recipe => {
        recipe.ingreds.forEach(ingredient => {
            if (myIngredientsList.includes(ingredient)) {
                count++;
            }
        });
    
        if (count === recipe.ingreds.length) {
            recipeMatch.push(recipe.name);
        }

        count = 0;
    });

    console.log(recipeMatch);
}

discoverMatchingRecipe(myIngredientsA); // No match found as 'Egg' is missing
discoverMatchingRecipe(myIngredientsB); // Match found as all ingredients match
discoverMatchingRecipe(myIngredientsC); // Match found as all ingredients match, regardless of extras

Answer 2

Based on the guidelines provided, here is a tailored solution that meets your requirements:

const recipeList = [{
    name: 'Carbonara',
    picFile: '',
    ingreds: ['Pasta', 'Cheese', 'Egg'],
    description: ['1', '2', '3']
}];

const myIngredientsA = ['Pasta', 'Cheese'];
const myIngredientsB = ['Pasta', 'Cheese', 'Egg'];
const myIngredientsC = ['Pasta', 'Cheese', 'Egg', 'Bacon'];

function discoverMatchingRecipe(myIngredientsList: string[]) {
    let count = 0;
    let recipeMatch: any[] = [];

    recipeList.forEach(recipe => {
        recipe.ingreds.forEach(ingredient => {
            if (myIngredientsList.includes(ingredient)) {
                count++;
            }
        });
    
        if (count === recipe.ingreds.length) {
            recipeMatch.push(recipe.name);
        }

        count = 0;
    });

    console.log(recipeMatch);
}

discoverMatchingRecipe(myIngredientsA); // No match found as 'Egg' is missing
discoverMatchingRecipe(myIngredientsB); // Match found as all ingredients match
discoverMatchingRecipe(myIngredientsC); // Match found as all ingredients match, regardless of extras

Answer 3

Answer №2

Appreciate the solution, however, there seems to be an issue when the menu is set as [carrot, pasta, cheese]. It consistently returns false. I would prefer a solution that can work with items in any arrangement.

Answer 4

Appreciate the solution, however, there seems to be an issue when the menu is set as [carrot, pasta, cheese]. It consistently returns false. I would prefer a solution that can work with items in any arrangement.

Answer 5

Answer №3

Having gone through your explanation, I devised a solution that suits my understanding. Since I lack knowledge in typescript, I opted to write the code in pure JavaScript:

const spaghetti = ['noodles', 'sauce'];
const dishA = ['noodles', 'sauce', 'vegetables'];
const dishB = ['noodles', 'tomato'];
const dishC = ['vegetables', 'noodles', 'sauce'];

const checkIngredients = (dish1, dish2) => {
  for (let i = 0; i < dish1.length; i++) {
    if (!dish2.includes(dish1[i])) {
        return false;
    }
  }
  return true;
};

console.log(checkIngredients(spaghetti, dishA)); // true: dishA has all the ingredients in Spaghetti plus vegetables
console.log(checkIngredients(spaghetti, dishB)); // false: dishB lacks sauce
console.log(checkIngredients(spaghetti, dishC)); // true: the order of ingredients doesn't matter

Answer 6

Having gone through your explanation, I devised a solution that suits my understanding. Since I lack knowledge in typescript, I opted to write the code in pure JavaScript:

const spaghetti = ['noodles', 'sauce'];
const dishA = ['noodles', 'sauce', 'vegetables'];
const dishB = ['noodles', 'tomato'];
const dishC = ['vegetables', 'noodles', 'sauce'];

const checkIngredients = (dish1, dish2) => {
  for (let i = 0; i < dish1.length; i++) {
    if (!dish2.includes(dish1[i])) {
        return false;
    }
  }
  return true;
};

console.log(checkIngredients(spaghetti, dishA)); // true: dishA has all the ingredients in Spaghetti plus vegetables
console.log(checkIngredients(spaghetti, dishB)); // false: dishB lacks sauce
console.log(checkIngredients(spaghetti, dishC)); // true: the order of ingredients doesn't matter

Finding compatibility between two arrays with flexibility

Answer №1

Answer №2

Answer №3

Similar questions

My goal is to utilize React JS to generate a table by sending the values through props using an array of objects

What could be causing the JSON.parse() function to fail in my program?

Iterate through an array containing objects that may have optional properties, ensuring to loop through the entire

Interacting with an element within a jQuery dialog box created through a function click

Can webpack integrate React components from a package and then recompile the package?

Limiting the style of an input element

What is the best way to remove any objects in this array that have empty strings as values?

Preventing Flash of Unstyled Content in ElectronJS Browser Windows

Cannot trigger a click event on nginclude in AngularJS

Developing an Angular Chart with AJAX

Turn a textfield on and off in real-time

Is there a way to create a comprehensive list of all the possible winning combinations in a game of 4-Dimensional Connect Four?

Type children are not permitted in the TypeScript container

Unable to implement the `omega/theme.css` file within the angular.json configuration

Adding a unique value to an array using JQuery when it does not already exist

Angular 2 - mistakenly spelled component name in selector tag leading to error notifications

Send information using AJAX within a .NET integrated browser

Guide to setting up an object array in JavaScript with unique child elements and no duplicate values

A URL that quickly updates live content from a backend script

"Implementing Two-Way SSL with Angular 2 and BrowserSync