Javascript复合模式，不能正确使用覆盖的方法

我有一个javascript组合器模式，我实现了(见下面的代码)。

在我的主类中，我实例化了MenuItem或Menu。我必须在组件上调用方法update()，它们应该返回相应的代码。

然而，它没有返回正确的totalitems量。它总是返回MenuComponent中定义的默认值0。

我认为这与this关键字有关，但我找不到确切的解决方案。

菜单项:

//MENU ITEM
//----------
var MenuItem = function(id) {
    MenuComponent.apply(this, [id, name]);
};
MenuItem.prototype = Object.create(MenuComponent.prototype);
MenuItem.prototype.constructor = MenuItem;
MenuItem.prototype.update = function() {
    //works
    console.log(this.ingredients)    
    //Doesnt work, this should display same as this.ingredients
    console.log(this.calculateIngredients())
    console.log("--------------")
};

菜单:

//MENU
//--------
var Menu = function(id, name) {
    MenuComponent.apply(this, [id, name]);
    this.menuitems = [];
};
Menu.prototype = Object.create(MenuComponent.prototype);
Menu.prototype.constructor = Menu;
Menu.prototype.add = function(menuitem) {
    this.menuitems.push(menuitem);
};
Menu.prototype.remove = function(menuitem) {
    for(var s, i = 0; s = this.getMenuItem(i); i++) {
        if(s == menuitem) {
            this.menuitems.splice(i, 1);
            return true;
        }
        if(s.remove(menuitem)) {
            return true;
        }
    }
    return false;
};
Menu.prototype.getMenuItem = function(i) {
    return this.menuitems[i];
};
Menu.prototype.calculateIngredients = function() {
    this.ingredients = 0;
    for(var key in this.menuitems) {
        this.ingredients += this.menuitems[key].calculateIngredients();
    }
    return this.ingredients;
};

MenuComponent

//MenuComponent
//-------------
var MenuComponent = function(id, name) {
    if(this.constructor === MenuComponent) {
        throw new Error("Can't instantiate abstract class");
    }
    this.id = id;
    this.name = name;
    this.ingredients = 0;
};
MenuComponent.prototype.calculateIngredients = function() {
    return this.ingredients;
};
MenuComponent.prototype.update = function() {
    console.log(this.ingredients)
    console.log("-----------------")
};

// HANDLER
var menuitem1 = new MenuItem(1)
    , menuitem2 = new MenuItem(2)
    , menuitem3 = new MenuItem(3)
    , menuitem4 = new MenuItem(4)
    , menuitem5 = new MenuItem(5)
    , menuitem6 = new MenuItem(6)
    , menuitem7 = new MenuItem(7)
    , menu = new Menu(1);
menu.add(menuitem1);
menu.add(menuitem2);
menu.add(menuitem3);
menu.add(menuitem4);
menuitem1.ingredients = 1
menuitem2.ingredients = 5
menuitem3.ingredients = 7;
menuitem4.ingredients = 2

// lets say i want to update the ingredient count of the following
menuitem1.update();
menuitem2.update();
menu.update();
//the update goes wrong, it doesnt display the correct amount, it alwasy displays 0 on the amounts where i commented

JSFiddle