execute code after subclass method is executed

Question

Given two classes, like so:

class A {
  method() {
    this.fn1();
  }

  fn1() {}
  fn2() {}
  fn3() {}
}

class B extends A {
  method() {
    super.method();

    this.fn2();
  }

  fn1() {}
  fn2() {}
}

I want to be able to call fn1 from the superclass, call fn2 from the subclass, then call fn3 from the superclass one time. More specifically, I want to trigger an "event" one time after the call tree is fully executed.

This problem is related to the problem of calling instance methods from a super constructor. I need to call a 'follow-up' method after the bottom subclass is complete.

Some ideas of how to do this:

• setTimeout or debounce from super (not going to work because this needs to be synchronous)
• always calling method from subclass (doesn't work when subclass gets extended)
• passing a function reference to fn3 to try to determine if it's the last function in a tree
• somehow modifying the prototype method of the subclass from the superclass

This last option seems most promising, but I need some direction.

How can I accomplish this?

Answer 1

I believe I have come up with a solution to this, but it may be suboptimal and I'm not positive it retains context properly:

https://jsfiddle.net/b6zqw19a/30/

class After {
  constructor(props) {
    if (this.construct) {
      if (this.afterConstruct) {
        this.after({
          construct: () => this.afterConstruct(),
        });
      }

      this.construct(props);
    }
  }

  after(fns) {
    Object.entries(fns).forEach(entry => {
      var key = entry[0];
      var call = entry[1];
      var fn = this[key];

      this[key] = (function(...args) {
        fn.bind(this)(...args);
        call.bind(this)();
      }).bind(this);
    });
  }
}