extending init method without being recursive, javascript

Question

I'm trying to extend functionality from using prototypes, but keep getting Maximum call stack size exceeded, basically, I'm doing this:

 var Parent = function() {};
 Parent.prototype.init = function(options){
    this.val_one = options.one;
    /*more init code*/
 };

var Child = function() {
   Parent.call(this);
};
Child.prototype = Parent.prototype;

Child.prototype.init = function(options) {
    this.val_two = options.two;
    //I also need val_one and all the initiation placed on the parent while keeping the init method name, (shadowing while extending?)

   Parent.prototype.init.call(this, options); 
   //will result in a self loop
   //copy all the method for adding a single extra value? is this the only way to do achieve this?
};

Any help will be appreciated.

`Child.prototype = Parent.prototype;` is your problem. You are literally calling yourself. — Bergi, Sep 20 '15 at 21:55
it's not the same question, please read it again, I would appreciate if you remove the duplicate. — andresmijares, Sep 20 '15 at 22:44
Yeah, it's not exactly the same question, but you said you'd appreciate *any* help - and I thought it would help you understanding what you got wrong. — Bergi, Sep 21 '15 at 10:02

score 0 · Answer 1 · edited May 23 '17 at 11:51

Child.prototype = Parent.prototype;

is your problem. You must not use that for "inheritance" - it makes Child and Parent instances have exactly the same prototype object.

Morever, as you can test, Parent.prototype.init === Child.prototype.init - you've overwritten the original init method (the one you created using Parent.prototype.init = function(options){…}) on that single object in the assignment Child.prototype.init = function(options) {…}. So your "super" call is actually calling the method itself again, which leads to your unbound recursion.

Instead, use

Child.prototype = Object.create(Parent.prototype);

and it will work as expected, as those are two distinct objects now.

score -1 · Answer 2 · answered Sep 20 '15 at 19:25

The init function you made is just another function , it is NOT the constructor and will not be called unless you call it within the constructor.

I made an example for you, hopefully this helps: https://jsfiddle.net/hfmbv98g/

var Parent = function(options) {
// constructor
this.val_one = options.one;
console.log("parent");
};

Parent.prototype.other_method = function() {
    console.log("Parent: other_method")
}

var Child = function(options) {
   Parent.call(this, options);
   this.val_two = options.two
   console.log("child");
};

Child.prototype = Object.create(Parent.prototype); // See note below
Child.prototype.constructor = Child;


Child.prototype.other_method = function() {
    console.log("Child: other_method")
};

You should also read up on this: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Introduction_to_Object-Oriented_JavaScript

Hi, thanks for your answer, however, it does to match my needs, I'm aware of how the constructor works, my question is directly to shadowing a method keeping the parent and extending a new one (the child). — andresmijares, Sep 20 '15 at 19:51

extending init method without being recursive, javascript

2 Answers2