OOP/Typescript alternative to extends, maintaining parent context in dependency

Question

I've created a class EventBus. This class provides an interface for attaching on/off/once methods to a class, the class extending it can in turn provide an array of possible events that can be listened to.

Currently, to make it work I need to extend the class with EventBus. I feel this isn't the right approach;

class Something extends EventBus {
   private events: Array<string> = [
    'ready',
  ];

  constructor() {
    this.registerEventBus(this.events);
  }
}

EventBus is initialised using a method, not a constructor, though a constructor can also be used;

class EventBus {
  private eventListeners: EventListeners = {};

  registerEventBus(eventListenersArray: Array<string> = []) {
    eventListenersArray.forEach((listener) => {
      this.eventListeners[listener] = [];
    });
  }
  ...on, off, supporting private methods etc

I'm wondering what the right approach for this is. I feel extending something with EventBus isn't correct inheritance, EventBus is a dependency that's used. My issue is that events should be chainable, returning the correct context after each call;

const someInstance = new Something();

someInstance
  .on('ready', () => {})
  .on('destroyed', () => {});

Currently I struggle to find a solution to this that works with typescript, I know it should be injected but I fail to do so. If anyone know the correct term for the approach I should take, or a sample of code that I can use to circumvent the extends, I would be very grateful!

Answer 1

yeah, you are right that publish subscriber pattern should not be inherited to be used through application. You can use ioc container or create a single instance of your event bus.

An example of singleton pattern in TypeScript:

class MyEventBus
{
    private static _instance: MyEventBus;

    private constructor()
    {
        //...
    }

    public static get Instance()
    {
        // Do you need arguments? Make it a regular static method instead.
        return this._instance || (this._instance = new this());
    }
}

and use it like this:

const MyEventBusInstance = MyEventBus.Instance;

An example of creating single instance of event bus can be seen here

UPDATE:

If you want to have an instance of event bus per instance of class, then you can create instance of event bus in your class:

class Something  {
    eventBus: EventBus

    constructor() {
        this.eventBus = new EventBus;
    }
}

UPDATE 1:

If you want EventBus to be available through hierarchy of classes, then you can create some hierarchy of your classes. E.g. "Animal", "Dog" and just declare event bus in base class "Animal". By doing this, methods will be available in all derived types.

class EventBus {
    runMe() {
        console.log("EventBus is run!");
    }
}

class Animal {
  eventBus: EventBus = new EventBus();

  move(distanceInMeters: number = 0) {
    console.log(`Animal moved ${distanceInMeters}m.`);
  }
}
 
class Dog extends Animal {
  bark() {
    console.log("Wooof! Wooof! Wooof!");
  }
}

and run it like this:

const dog = new Dog();
dog.bark(); // "Wooof! Wooof! Wooof!" 
dog.move(11); // "Animal moved 11m."
dog.eventBus.runMe() // "EventBus is run!"

UPDATE 2:

If you want to have chainable methods, then you can use Fluent interface pattern. Let me show an example of code:

class EventBus {
    onFoo(eventName: string) {
        console.log("EventName is: ", eventName);
        return this;
    }
}

class Animal extends EventBus {
  eventBus: EventBus = new EventBus();

  move(distanceInMeters: number = 0) {
    console.log(`Animal moved ${distanceInMeters}m.`);
    this.onFoo("Hello").onFoo("World").onFoo("!"); // fluent interface pattern
  }
}
 
const dog = new Animal();
dog.move(10);