Inherit multiple classes with constructor in Typescript

Question

I would like my class to extends multiple classes. I saw an example using typescript mixins but no example classes have a constructor. I need a class to implement many classes with a constructor, like this:

class Realm {
   private _realms: ContractType;
   constructor(realms: ContractType) {
      this._realms =  realms;
   }
   realmsFunction() {
      // do smt...
   }
}

class Resource {
   private _resources: ContractType;
   constructor(resources: ContractType) {
      this._resources = resources
   }
   resourceFunction() {
      // do smt else ...
   }
}

class Player extends Realm, Resource {
   constructor(realms, resources) {
      super.Realm(...);
      super.Resources(...);
   }
}

The only way I found to cleanly do this is (minimal viable example)

class Realm {
    private _realms: string;
    constructor(realms: string) {
       this._realms =  realms;
    }
    realmsFunction() {
       // do smt...
    }
 }
 
 class Resource {
    private _resources: string;
    constructor(resources: string) {
       this._resources = resources
    }
    resourceFunction() {
       // do smt else ...
    }
 }
 
 class Player {
    constructor(realms, resources) {
        Object.assign(this, new Realm("realm"), new Resource("resource"));
    }

    foo() {
        this.realmsFunction(); // err: this function doesn't exist
    }
 }

But typescript complain that this.realmsFunction or this.resourcesFunction doesn't exist on this. How can I make this error disapear ?

Another solution I found is

class Player {
   private _realms: Realms;
   private _resources: Resources;

   constructor(realms, resources) {
      this._realms = new Realms(realms);
      this._resources = new Resources(resources);
   }
}

This would work just fine, but it's not really using the amazing polymorphism that JS gave us, so I'm not sure it's a good solution or not.

How can I either make the TS error disapear, or find a solution that allow me to inherit many classes with constructor using typescript ?

Please provide a self-contained [mre] that clearly demonstrates the issue you are facing, as plain text in the body of your post. Ideally I could paste such code into a standalone IDE and immediately get to work solving the problem without first needing to re-create it. So there should be no pseudocode, typos, unrelated errors, or undeclared types or values. (If you want to provide a [playground link](https://tsplay.dev/Woa5eN) that's great, but please also put the full example in the body of the post as text.) — jcalz, Jun 14 '22 at 18:31
Do you expect that all the constructors you're using will each take exactly one constructor argument as shown in your example? If not, can you alter your example so that some constructors take zero or more than one parameter, while detailing how you want the resulting class constructor to behave? If each constructor you're using takes a single parameter, does [this approach](https://tsplay.dev/WvKAMw) meet your needs? If so I can write up an answer explaining it; if not, what am I missing? — jcalz, Jun 15 '22 at 15:05

score 0 · Answer 1 · answered Jun 14 '22 at 15:17

Multiple inheritance is not supported in TypeScript

You could do something with composition and interfaces for example

interface ContractType {}
interface IRealm {
  realmsFunction: () => void;
}
interface IResource {
  resourceFunction: () => void;
}

class Realm implements IRealm {
  private _realms: ContractType;
  constructor(realms: ContractType) {
    this._realms = realms;
  }
  realmsFunction() {
    // do smt...
  }
}

class Resource implements IResource {
  private _resources: ContractType;
  constructor(resources: ContractType) {
    this._resources = resources
  }
  resourceFunction() {
    // do smt else ...
  }
}

class Player implements IRealm, IResource {
  private realm: Realm;
  private resource: Resource;
  constructor(realms, resources) {
    this.realm = new Realm(realms);
    this.resource = new Resource(resources);
  }
  realmsFunction(): void {
    return this.realm.realmsFunction()
  }
  resourceFunction(): void {
    return this.resource.resourceFunction()
  }
}

Hmm I want to inherit maybe 8 classes, with each class having multiple functions. I feel like I'll end up with a huge messy file after that — Cizia, Jun 14 '22 at 15:22
Multiple inheritance introduces more issues (For more in depth discussion of that see https://stackoverflow.com/questions/406081/why-should-i-avoid-multiple-inheritance-in-c). The issue I would point out is the complexity and therefore the impact on maintainability. Mixins, btw, in my opinion do not help creating clear and readable code either. Could you not use other code sharing features like services, helper classes etc? — Arjan, Jun 15 '22 at 06:31
As a side note: structuring code in multiple files (keeping interfaces apart from implementations) also helps to keep structures and intentions clear — Arjan, Jun 15 '22 at 06:34

Inherit multiple classes with constructor in Typescript

1 Answers1