Question

I have a set of classes I derive from a base class as following (for example):

function Base(){}
Base.prototype.foo = function() { alert("base"); };

function Derived() {}

Derived.prototype = Object.create( Base.prototype );
Derived.prototype.foo = function() { alert("overridden"); };  

var b = new Base();
var d = new Derived();

b.foo();
d.foo();

I would like to add variables to the base class (not Java static-like variables, but those with separate values per class instance). Yet, I would like the Derived class to be able to access them too.

I am no Javascript specialist, I have been playing around a little, but I can’t get it to work. Is this possible to achieve this? Or should I implement setter and getters?

Answer 1

An example:

function Base( name ){
    this.name = name;
}


function Derived( name, type ) {
    Base.call( this, name );
    this.type = type;
}
Derived.prototype = Object.create( Base.prototype );


var b = new Base( 'Peter' );
var d = new Derived( 'John', 2 );

So, the Base class defines one instance member – 'name'. The Derived class defines one additional instance member – 'type'.

The key part is invoking the Base constructor inside the Derived constructor invocation – so, internally, you “set up” the instance as if it were a Base instance (you pass in the required arguments), and then you augment the instance with the additional stuff defined only for Derived instances.

So, in my example above, b has one own property – 'name', whereas d has two own properties – 'name', and 'type'.