Inheritance in JavaScript: Calling parent's method

Question

The way I implement inheritance in JavaScript is shown in the example below. I am trying to call from the child class a method of the parent class. I have seen many examples online, that add the parent method to the prototype, and the use the call or apply function (but my implementation is not doing that). Is there a way to make this type of call?

function classM() //parent class
{
    this.myName = function()
    {
        console.log('parent');
    }
}

function classEM ()
{
    classM.call(this);

    this.myName = function()
    {
        console.log('child');
        //HOW DO I CALL myName() of the parent class?
    }

}


classEM.prototype = Object.create(classM.prototype);
classEM.prototype.constructor = classEM;




var rm = new classEM();
rm.myName(); //should print child and then parent

You're not using prototypal inheritance on classM, so Object.create(classM.prototype) returns an object with no myName method. When you do classM.call(this), the object gets the method, but then you overwrite it, so no, you can't call it. — cookie monster
– cookie monster, Commented Jul 10, 2014 at 14:16
@cookiemonster I understand that, but is there a way to fix it? — FranXh
– FranXh, Commented Jul 10, 2014 at 14:18
If you want to call both myName methods, why not create a new instance of classM inside classEM and call the darn method ? — adeneo
– adeneo, Commented Jul 10, 2014 at 14:20

thefourtheye · Accepted Answer · 2014-07-10 14:38:13Z

2

When you do this.myName = ... in classEM, you are replacing the old myName function created by the parent with the one in classEM. So only one function exists now. Instead, you can add the myName function in the classM's prototype and inherit from it.

So the program becomes like this

function classM() {}

// Add myName to the parent
classM.prototype.myName = function() {
    console.log('parent');
}

function classEM() {
    this.myName = function() {
        // Get the parent prototype object and invoke the myName in it.
        Object.getPrototypeOf(this).myName();
        console.log('child');
    }
}

classEM.prototype = Object.create(classM.prototype);
classEM.prototype.constructor = classEM;

var rm = new classEM();
rm.myName();

Output

parent
child

answered Jul 10, 2014 at 14:38

thefourtheye

241k53 gold badges466 silver badges505 bronze badges

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

4 Comments

FranXh Over a year ago

I came up with the same solution, but instead of the Object.getPrototypeOf(this).myName(); I call classM.prototype.myName.call(this);. Do you know if there is a difference between your way and this one?

thefourtheye Over a year ago

@FranXh Well, my approach will have the flexibility with the this. We can dynamically change the this object :-)

FranXh Over a year ago

I see. The reason I was asking is mostly because of the "this" and "that" usage in JavaScript. I use "that" inside functions

thefourtheye Over a year ago

@FranXh Normally, when we define inner functions, if they need to retain the this of the outer function, we store it in a conventional variable that as var that = this. Apart from that we don't have to worry much about that

Collectives™ on Stack Overflow

Inheritance in JavaScript: Calling parent's method

1 Answer 1

4 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

4 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related