Inheritance: Constructor not working "super"?

Question

I came across this behavior after using JS for several months. I am very puzzled because of my Java background: create a class and create subclasses. A call to the constructor of the subclass will not call the parent constructor. Ok, I read about this behavior, it seems normal, right?

See this jsfiddle example to help me clarify.

So, so that my subclass constructor runs each of its parent constructor, I add the following (see jsfiddle example

Well, it seems to work better. Now I wonder about the following: Is there a way to indicate if a superclass without a trigger is its constructor? For example, the following method executes Node ():

GameObject.prototype = new Node(); GameObject.prototype.constructor=GameObject; 

(see updated jsfiddle example )

I cannot help but feel that I am not doing it right. Since my real model is superimposed on 7 subclasses, it has 21 calls for my constructors (6 + 5 + 4 + 3 + 2 + 1 = 21).

Am I doing something wrong? Thank you for your time!

Answer 1

As a rule, you are doing everything right. But your constructor function creates properties in its instances, and these properties are assigned to the inheriting prototype constructor.

Subclass.prototype.animations , for example, resides on a prototype shared by all additional instances of Subclass . From your code, it seems that you planned that these animations will be recreated for each instance.

How to solve this problem? Do not use constructor functions at all. Use object literals and Object.create .

 var Node = { init: function () { this.animations = []; }, doSomething: function () { console.log(this.animations); } }; var GameObject = Object.create(Node); GameObject.doSomethingElse = function () { this.init(); this.doSomething(); } 

Create the same way you inherit:

 var gameObj = Object.create(GameObject); gameObj.doSomethingElse(); 

It should not be harder.

See Combining inheritance with a module template .

Answer 2

You are not doing anything wrong in your own way. This is the expected behavior, given your code. However, you can use an approach similar to that described in John Resig's Simple JavaScript Inheritance . Another discussion of a similar approach can be found at fooobar.com/questions/145 / ....

Answer 3

I understand that JavaScript does not naively implement classes in the way traditional languages ​​like C ++, Java, and C # do. I think you can get the behavior you want using the JavaScript framework that enforces the behavior you're used to in langauges, like Java.

Moo Tools is one such framework: http://mootools.net

Answer 4

You do not need to call the parent constructor just to set up the inheritance chain. See http://js-bits.blogspot.com/2010/08/javascript-inheritance-done-right.html

The following is not bad: it starts the parent constructor only to set up the prototype chain

 GameObject.prototype = new Node(); GameObject.prototype.constructor = GameObject; 

It’s best to use a surrogate constructor that attaches the prototype without instantiating the superclass.

 // Surrogate constructor var TempCtor = function(){}; TempCtor.prototype = Node.prototype; // Setup the prototype chain without side effects GameObject.prototype = new tempCtor(); GameObject.prototype.constructor=GameObject; 

And you need to make sure you call the parent constructor from the subclass

 function GameObject() { // Call the parent constructor Node.call(this); } 

I updated your jsfiddle with an example that shows the correct way to configure inheritance http://jsfiddle.net/2caTD/5/