Misunderstanding about prototypal inheritance arise from the problem that in contrary to classical inheritance base constructor is not called to instantiate base object. Setting prototype to base object is not equivalent to classical inheritance, because prototype is shared among instances. As described in detail by Jimmy Breck-McKye. So to achieve parasitic inheritance you will have to follow two rules.
- Never define field members in prototype directly.
- Always call base constructor when instantiating successor
The latter can be achieved to one's taste using Object.create or assigning instance of base object directly to prototype. Given that Base is a constructor function, code for inheritance will be like below
Way #1
function Base(){
//a new object is created which is assigned to 'this'
//this object has __proto__ === Base.prototype
this.baseMember = 'I am the parent';
}
Base.prototype.baseMethod = function(){
console.log('I am Base');
};
function Successor(){
//a new object is created which is assigned to 'this'
//this object has __proto__ === Successor.prototype
//we override the object's property which is used for prototypal lookup
//we lose members defined in Successor.prototype
this.__proto__ = new Base();
//we add a new property in the inherited object
this.successorMember = 'I am a child';
}
Successor.prototype.successorMethod = function(){
console.log('I am Successor');
};
We will use defined constructor in the following manner
var child = new Successor();
//resulting in structure
//child: { //instance of Successor
// successorMember: 'I am a child',
// __proto__: {//instance of Base
// baseMember: 'I am the parent'
// __proto__: {//Base.prototype
// baseMethod : function
// }}}
console.log(child.successorMember);//accessible via direct property
console.log(child.baseMember);//accessible via prototype lookup
console.log('baseMethod' in child);//true, accessible via prototype lookup
console.log('successorMethod' in child);//false, method doesn't exist anywhere in the chain
Pay attention to the missing successorMethod defined via Successor.prototype. This happened because we've overridden __proto__ property of the object.
Way #2
Another way to override the __proto__ property is to call Object.create. However this function returns a new object and thus we will have to override the object that is returned by Successor constructor
function Successor(){
//a new object #1 is created which is assigned to 'this'
//this object has __proto__ === Successor.prototype
//a new instance #2 of Base is created with __proto__ === Base.prototype
//a new object #3 is created with a __proto__ set to #2
var successor = Object.create(new Base());
//a new property is added to #1
this.neverShowMember = 'I will not exist in resulting object';
//a new property is added to #3
successor.successorMember = 'I am a child';
//return of a non-primitive type object from constructor overrides the result
return successor;//return object #3
}
Let's examine usage of this approach in detail:
var child = new Successor();
//child: { //instance of Object
// successorMember: 'I am a child',
// __proto__: {//instance of Base
// baseMember: 'I am the parent'
// __proto__: {//Base.prototype
// baseMethod : function
// }}}
console.log(child.successorMember);//accessible via direct property
console.log(child.baseMember);//accessible via prototype lookup
console.log('baseMethod' in child);//true, accessible via prototype lookup
console.log('successorMethod' in child);//false, method doesn't exist anywhere in the chain
Resulting behaviour is pretty much the same. Pay attention to the missing neverShowMember although it was defined for this within constructor. It may be source of mistakes.
Way #3
Yet another way to inherit is not to mess around with proto chains. This approach is described in Jimmy Breck-McKye's article. I will skip detailed comments which were provided previously and will focus on changes
function Successor(){
//a new instance Base is created with __proto__ === Base.prototype
var successor = new Base();
//extend object with a new property
successor.successorMember = 'I am a child';
return successor;//return instance of Base with extra properties
}
var child = new Successor();
//child: { //instance of Base
// successorMember: 'I am a child',
// baseMember: 'I am the parent'
// __proto__: {//Base.prototype
// baseMethod : function
// }}
console.log(child.successorMember);//accessible via direct property
console.log(child.baseMember);//accessible via direct property
console.log('baseMethod' in child);//true, accessible via prototype lookup
console.log('successorMethod' in child);//false, method doesn't exist anywhere in the chain
You see that schema became flat. As an obvious conclusion you can't access base members if you override them. So if inside Successor we define
successor.baseMember = 'I am already grown enough!';
The instance (child) will lose access to baseIntance.baseMember which equals "I am the parent". In contrary to previous approaches when it would be accessible via child.__proto__.baseMember. But I believe this is not a common scenario when developing in javascript and should covered under another question.
Note that in all cases members defined in Successor.prototype are lost. You should take care of copying them manually in Successor constructor.
Conclusion
I hope this description was clear enough to understand that CraCrockford's object function
function object(o) {
function F() {}
F.prototype = o;
return new F();
}
always requires a new instance passed as parameter o to achieve parasitic inheritance. Thus it's usage should look like below
var child = object(new Base());
child.successorMember = 'I am a child';
Same applies to the code from OP. To follow parasitic inheritance superInstance should be a new instance each time it is passed to Object.create. Thus it should be a factory function
var superInstance = function(){
return {
member1: 'superMember1',
member2: 'superMember2'
}
};
var subInstance = Object.create(superInstance());
or a constructor
function superInstance(){
this.member1: 'superMember1',
this.member2: 'superMember2'
};
var subInstance = Object.create(new superInstance());
Hope this helps
