Meal Maker Dollar Calculations awry

OK. So I just completed the Meal Maker activity in Javascript. I got it to work, however the calculation on my dollar total is acting odd. It will output like $24.00000003 or same but .000000002. I can understand why sometimes it will give me like 12.5 because the total is 12.50. but I cannot figure out why it’s giving me these tiny decimals? My menu items are all to the tenth place…

Code is as follows

const menu = {

_courses: {

appetizers: [],

mains: [],

desserts:[],

},

get appetizers() {

return this.courses.appetizers;

},

get mains(){

return this.courses.mains;

},

get desserts() {

return this.courses.desserts;

},

set appetizers(appetizers) {

this._courses.appetizers=appetizers;

},

set mains(mains) {

this._courses.mains= mains;

},

set desserts(desserts) {

this._courses.desserts= desserts;

},

get courses() {

return {

  appetizers: this.appetizers,

  mains: this.mains,

  desserts: this.desserts,

};

},

addDishToCourse(courseName, dishName, dishPrice) {

const dish= {

name: dishName,

price: dishPrice,

};

return this._courses[courseName].push(dish);

},

getRandomDishFromCourse(courseName) {

const dishes = this._courses[courseName];

const randomIndex = Math.floor(Math.random()*dishes.length);

return dishes[randomIndex];

},

generateRandomMeal() {

const appetizer = this.getRandomDishFromCourse(“appetizers”);

const main = this.getRandomDishFromCourse(‘mains’);

const dessert = this.getRandomDishFromCourse(“desserts”);

const totalPrice = appetizer.price + main.price + dessert.price;

return Your meal is ${appetizer.name}, ${main.name}, ${dessert.name}. The price for your meal is $ ${totalPrice}.;

}

};

menu.addDishToCourse(“appetizers”, “salad”, 5.99);

menu.addDishToCourse(“appetizers”, “calamari”, 7.85);

menu.addDishToCourse(“appetizers”, “nachos”, 5.50);

menu.addDishToCourse(“mains”, “steak”, 18.25);

menu.addDishToCourse(“mains”, “BBQ chicken”, 11.75);

menu.addDishToCourse(“mains”, “lasagna”, 14.50);

menu.addDishToCourse(“desserts”, “chocolate cake”, 3.99);

menu.addDishToCourse(“desserts”, “tiramisu”, 4.99);

menu.addDishToCourse(“desserts”, “ice cream”, 4.50);

const meal = menu.generateRandomMeal();

console.log(meal);

Computers store numbers using binary (base 2) while humans use a base 10 system. Which causes this discrepancy

there are plenty of articles which explain this in more depth:

http://adripofjavascript.com/blog/drips/avoiding-problems-with-decimal-math-in-javascript.html

I also found this stackoverflow question which suggest:

If you just don’t want to see all those extra decimal places: simply format your result rounded to a fixed number of decimal places when displaying it.

which seems the right solution for you :slight_smile:

side note: oversight or underestimating this problem has lead to some serious problems in the past, if you are interested you can google: The Patriot Missile Failure. Its a slightly complicated yet fascinating read.

Thanks so much! That was an awesome response and I had tried some googling, however I think in my needing sleep state didn’t really know how to formulate a question helpfully. Thanks again and I will definitely check out the lauch!

Being well rested helps a lot :slight_smile:

the missile is both a good and tragic example of what can go wrong. And related to weird floating point arithmetic

1 Like

I also now feel like a genius because I understand the movies where they steal these tiny increments of money based on this exact same feature. Those never made sense. So now I know my error can cause either a crisis or possibly to be a billionaire. yes! thanks again

1 Like