调用阴影原型方法的更简单/更好的方法？

Question

I'm writing an object hierarchy in JavaScript, I would like to call a method on an object's parent when I've shadowed that method in the object.

Eg:

var Base = function Base(msg) {
  this.msg = msg;
}
Base.prototype.log = function(){
  console.log("base log: " + this.msg);
}

var Sub = function Sub(msg) {
  Base.call(this, msg);
}

Sub.prototype = Object.create(Base.prototype);

Sub.prototype.log = function() {
  console.log("sub log");

  this.__proto__.__proto__.log.call(this); // This works but __proto__
  Object.getPrototypeOf(Object.getPrototypeOf(this)).log.call(this); // This works but is verbose
  super.log(); // This doesn't work
}

var sub = new Sub('hi');
sub.log();

See the three lines at the bottom of the Sub.prototype.log function - is there a better way to do what I'm trying to do there?

The second line is the best I've been able to come up with but is very verbose!

Answer 1

super is not defined, obviously it wouldn't work.

You might want to try:

Sub.prototype.log = function() {
  console.log("sub log");

  Base.prototype.log.call(this);
}

Another way is to use the following method to inherit classes:

function extend(Child, Parent) {
    var F = function() { };
    F.prototype = Parent.prototype;
    Child.prototype = new F();    

    // better to make it static (better practice in OOP world) 
    // e.g. Child.super = ...,
    // but in your case:
    Child.prototype.super = Parent.prototype;      
}

So here is an example:

// ..
extend(Sub, Base);

Sub.prototype.log = function() {
  console.log("sub log");

  this.super.log.call(this);
}

In case of ES6 :

class Base {
  constructor(msg) {
    this.msg = msg;
  }

  log(){
    console.log("base log: " + this.msg);
  }
}

class Sub extends Base {
  constructor(msg) {
    super(msg);
  }

  log() {
    console.log("sub log");
    super.log();
  }
}

var sub = new Sub('hi');
sub.log();

Answer 2

If you want to keep the original method without using the name Base you could capture it using a closure before you change it.

(function() {
   var superLog = Sub.prototype.log;
   Sub.prototype.log = function() {
       console.log("sub log");
       superLog();
   };
})();

This way there is no dependancy on how you inherit from Base .

Side note: the terminology you are looking for is 'overriding' the base method.