Why is the function not being redefined?

Question

JavaScript

function Button(t_color_in,t_color_out,pos,perimetr,click_func){
  HShape.call(this,pos,perimetr);
  this.onclick_color=t_color_in;
  this.unclick_color=t_color_out;
  console.log('hello');
}
Button.prototype=Object.create(HShape.prototype);
Button.prototype.constructor=Button;

Button.prototype.draw = function(hcanvas){
  HShape.prototype.draw.apply(this,hcanvas);
  if (this.isPointInside(mouse.position)){
    this.color=this.onclick_color;
  }else{
    this.color=this.unclick_color;
  }
  console.log(this.isPointInside(mouse.position));
};
var button =new Button(........);
button.draw();//здесь исполняется функция HShape.draw а не Button.draw()

does it matter how functions are defined in HShape?
I now define them:

function HShape(){
    this.draw=function(){
    }
}

or is it necessary through HShape.prototype?

Answer 1

If we move the draw of the base class to the prototype, everything should work correctly. This happens because calling the base class constructor adds a draw method to your child class's this. And when draw is called, it is in the first place than the method from the prototype.