Javascript inheritance without child.prototype = new parent();

Question

I was playing around with javascript prototype chain inheritance and i came accross this funny behaviour.

I have a parent class and a child class

//class parent
function parent(param_1) {
    this.param_1 = param_1;

    this.getObjWithParam = function(val) {
        console.log(this);
        console.log("Constructor value in parent class " + this.param_1);
        console.log("tguha ----> parent,  val " + val);
    };
};

//class child
function child(param_1) {
    parent.call(this, [ param_1 ]);
};

var childObj = new child(100);
childObj.getObjWithParam(200);

and i get the output as

**>child**
Constructor value in parent class 100
tguha ----> parent,  val 200

and nowhere i'm doing //child.prototype = new parent(); and still the parent class is inherited.

Could anyone help me by explaining this scenario please.

Alex Wayne · Accepted Answer · 2012-01-05 09:05:35Z

2

The word prototype does not appear in this code. So nothing is being inherited. You create a new child and then explicitly run the parent constructor function on that new child. The parent constructor function then add a method to to the new child.

If you put getObjWithParam on parent.prototype.getObjWithParam instead then you will see that it will not carry over.

answered Jan 5, 2012 at 9:05

Alex Wayne

188k52 gold badges328 silver badges363 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Tirtha Over a year ago

I had another confusion on the same lines. this time, i have 3 levels of intheritance and instead of parent.call(this, [ param_1 ]); I have this.constructor(param_1); to pass call to the super class constructor. I've described the question here few days back. stackoverflow.com/q/8701114/1099211 Probably the same logic could explain the phenomenon that happens there too.

Krzysztof · Accepted Answer · 2012-01-05 09:02:09Z

1

You invoke parent constructor in child constructor. Because parent constructor sets this.getObjWithParam = function[...] it'll also set it for child. Notice that this has nothing to do with prototype. By invoking parent.call(a, [...]) you invoke parent function and set scope to a. That means any modification made to this is also made to a (because it's the same object).

answered Jan 5, 2012 at 9:02

Krzysztof

16.2k2 gold badges52 silver badges79 bronze badges

Comments

max · Accepted Answer · 2012-03-02 20:38:45Z

1

parent.call(this, [ param_1 ])

Assigns Parent.param_1 and Parent.getObjWithParam to childObj. This has nothing to do with inheritance. Consider this formulation:

var foo = {};

//class parent
function parent(param_1) {
    this.param_1 = param_1;

    this.getObjWithParam = function(val) {
        console.log(this.param_1);
        console.log(val);
    };
};

//class child
function child(param_1) {
    parent.call(foo, [ param_1 ]);
};

var childObj = new child( 'lets give foo a param_1');

console.log( typeof childObj.getObjWithParam );
// Undefined

foo.getObjWithParam();
// ["lets give foo a param_1"]

here you are passing foo as a scope to .call() thus the properties are assigned to foo.

answered Mar 2, 2012 at 20:38

max

103k15 gold badges113 silver badges178 bronze badges

Collectives™ on Stack Overflow

Javascript inheritance without child.prototype = new parent();

3 Answers 3

1 Comment

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

1 Comment

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related