How `this` works from a Classical Method of Prototyping in Javascript

Question

I'm on my journey to learn Object-Oriented Programming in Javascript. I got this video lession from here http://www.objectplayground.com/ which I understood quite a bit the prototypal method over classical method.

While watching the lession, I was paused by the example shown for the classical method to work with subclasses which is the below:

//superclass
function Answer(value){
     this._val = value;
}

//define prototype property 'get' for the superclass
Answer.prototype.get = function fn1(){
    return this._val;
}

//subclass
function FirmAnswer(value){
    Answer.call(this,value);
}

FirmAnswer.prototype = Object.create(Answer.prototype);
FirmAnswer.prototype.constructor = FirmAnswer;

//define prototype property 'get' for subclass
FirmAnswer.prototype.get = function fn2(){
   return Answer.prototype.get.call(this);
}


var luckAnswer = new FirmAnswer(7);
luckAnswer.get(); //7

Question:

From my understanding of call function, it will set the this to the current context which is for example from this line Answer.call(this,value) from the FirmAnswer function, so the _val from Answer will be set for the FirmAnswer and not for the Answer (please correct me if I'm wrong).

So it leads me to my confusion if the above analyzation is correct, as to why the get property of the FirmAnswer.prototype returns Answer.prototype.get.call(this) and not just Answer.prototype.get() alone since the this is already set to FirmAnswer when calling new FirmAsnwer(7)?

Please shed me some light as I'm pretty confused as of the moment. I'm pretty sure I understand well the prototypal method but the classical method confuses me quite a bit.

Thank you in advance!

Answer 1

Irrelevant since edit to question

This is weird code and contains one mistake and something else that's inexplicable.

The mistake is this line:

FirmAnswer.prototype.get = Object.create(Answer.prototype);

This is obviously nonsense code, particularly as FirmAnswer.prototype.get gets set to something far more sensible two lines later. I'm fairly sure it's meant to be:

FirmAnswer.prototype = Object.create(Answer.prototype);

That's the normal way of doing prototypal inheritance in pre-ES6 Javascript.

End irrelevance

I don't understand why FirmAnswer.prototype.get gets set to another method, when the call would be delegated to Answer.prototype.get in any case once the above error is fixed.

You asked a specific question, however: why is this line necessary:

return Answer.prototype.get.call(this);

Why can't we just do Answer.prototype.get()? When we did Answer.call(this,value);, it set the context (this value) for that call only. It only affected the constructor function. If you did Answer.prototype.get(), the context for the function call would actually be Answer.prototype, which doesn't have a _val property.

This is all irrelevant, however, because that method is not actually needed. Here's the code in a more sensible form:

//superclass
function Answer(value){
     this._val = value;
}

//define prototype property 'get' for the superclass
Answer.prototype.get = function fn1(){
    return this._val;
}

//subclass
function FirmAnswer(value){
    Answer.call(this,value);
}

FirmAnswer.prototype = Object.create(Answer.prototype);
FirmAnswer.prototype.constructor = FirmAnswer;

var luckAnswer = new FirmAnswer(7);
console.log(luckAnswer.get()); //7