Implementing instance methods/variables in prototypal inheritance

javascript

Solution

Javascript provides a way to do this the way U are used to :) try this:

function Depot() {   
    this.stockpile = [],
    this.loadAmmo = function (ammoType) {
        this.stockpile.push(ammoType);
    }
};

var MissileDepot = new Depot();
var GunDepot = new Depot();


MissileDepot.loadAmmo("ICBM");
MissileDepot.loadAmmo("Photon Torpedo");

alert(MissileDepot.stockpile); // outputs "ICBM,Photon Torpedo"
alert(GunDepot.stockpile); // outputs ""

And U can add the functions on the fly afterwards:

MissileDepot.blow = function(){alert('kaboom');}

Extending object with another object is also an option, but what You wanted is the fact, that OO programming in javascript is done by functions not objects with {} ;)

EDIT:

I feel bad for writing that without mentioning: The javascript "new" keyword is only for making it easier to OO veterans. Please, dig deeper into the prototypal inheritance and dynamic object creation as therein lies true magic! :)

Problem

I've been playing around with prototypal inheritance after reading http://javascript.crockford.com/prototypal.html and having a bit of a problem with understanding how I could make use of it in the way I would use classical inheritance. Namely, all functions and variables inherited by the prototype essentially become statics unless they are overwritten by the child object. Consider this snippet: ``` var Depot = { stockpile : [], loadAmmo : function (ammoType) { this.stockpile.push(ammoType); } }; var MissileDepot = Object.create(Depot); var GunDepot = Object.create(Depot); ``` `stockpile` and `loadAmmo` definitely should be in the prototype, since both MissileDepot and GunDepot have them. Then we run: ``` MissileDepot.loadAmmo("ICBM"); MissileDepot.loadAmmo("Photon Torpedo"); alert(MissileDepot.stockpile); // outputs "ICBM,Photon Torpedo" alert(GunDepot.stockpile); // outputs "ICBM,Photon Torpedo" ``` This is expected because Neither `MissileDepot` nor `GunDepot` actually have `stockpile` or `loadAmmo` in their objects, so javascript looks up the inheritance chain to their common ancestor. Of course I could set GunDepot's stockpile manually and as expected, the interpreter no longer needs to look up the chain ``` GunDepot.stockpile = ["Super Nailgun", "Boomstick"]; alert(GunDepot.stockpile); // outputs "Super Nailgun,Boomstick" ``` But this is not what I want. If this were classical inheritance (say Java), loadAmmo would operate on MissileDepot and GunDepot's stockpile independently, as an instance method and an instance variable. I would like my prototype to declare stuff that's common to children, not shared by them. So perhaps I'm completely misunderstanding the design principles behind prototypal inheritance, but I'm at a loss as how to achieve what I've just described. Any tips? Thanks in advance!

Original source