https://www.codecademy.com/courses/introduction-to-javascript/projects/meal-maker
Hi everyone, I’m trying to challenge myself and figure out the alternative solution to the Meal Maker project, where it says to add an array of meals and prices. I can’t figure out how to link together the meals and the prices in order to get them into the console.log of todaySpecial. I have been really experimenting a lot, but no solution in sight. Any ideas?
Here is my code so far:
let menu = {
meal: [
{
_name: "Spaghetti al Pesto",
_price: 8,
},
{
_name: "Pizza Margherita",
_price: 10,
},
{
_name: "Hamburger di Verdure",
_price: 12,
},
],
set mealName(mealToCheck) {
if (typeof mealToCheck === "string") {
return (this.meal._name = mealToCheck);
}
},
set price(priceToCheck) {
if (typeof priceToCheck === "number") {
return (this.meal._price = priceToCheck);
}
},
get todaySpecial() {
if (this.meal._name && this.meal._price) {
for (let todayMeal in menu.meal) {
return `Today’s Special is ${this.menu.meal[todayMeal]._name} for $${this.menu.meal[todayMeal]._price}!`;
}
} else {
return `Meal or price was not set correctly!`;
}
},
};
console.log(menu.todaySpecial);
// menu.meal = "Spaghetti al Pesto";
// menu.price = 14;
// console.log(menu);
A function can only return one thing,
so the return
you put in the loop will exit the function (and the loop) on the first iteration of the loop.
(The loop won’t continue running after the first time that return
is reached.)
Remember that the stuff in the array can be accessed by a numerical index.
In your code, you could show a randomly selected meal and its price, by choosing an appropriate random number that could be an index of the this.meal
array.
get todaySpecial() {
if (this.meal.length > 0) {
const randomIndex = Math.floor(Math.random() * this.meal.length);
return `Today's Special is ${this.meal[randomIndex]._name} for $${this.meal[randomIndex]._price}`;
}
else {
return "Meal or price was not set correctly!";
}
}
or you could loop through each element in the array and add it to a string,
here it is as a method [function] instead of as a getter:
listMenu() {
let output = "";
for (let i = 0; i < this.meal.length; i++) {
output += `On the menu, we have ${this.meal[i]._name} for $${this.meal[i]._price} \n`;
}
return output;
}
or if you do a for-of loop for the same thing:
listMenu() {
let output = "";
for (let item of this.menu) {
output += `On the menu, we have ${item._name} for $${item._price} \n`;
}
return output;
}
1 Like
Thanks for the suggestions! Very helpful.
I tried to apply the first suggestion, but I get the following error:
if (this.meal.length > 0) {
^
TypeError: Cannot read properties of undefined (reading 'length')
Any idea why this happens? The meal array should have a length.
It seemed to work when I tried it.
let menu = {
meal: [
{
_name: "Spaghetti al Pesto",
_price: 8,
},
{
_name: "Pizza Margherita",
_price: 10,
},
{
_name: "Hamburger di Verdure",
_price: 12,
},
],
get todaysSpecial() {
if (this.meal.length > 0) {
const randomIndex = Math.floor(Math.random() * this.meal.length);
return `Today's Special is ${this.meal[randomIndex]._name} for $${this.meal[randomIndex]._price}`;
}
else {
return "Meal or price was not set correctly!";
}
}
}
console.log(menu.todaysSpecial);
Notice there’s no loop in the function.