Mixins with type checking in Typescript
The only available solution, until now, was to duplicate class properties and method, in order to make the compiler happy then use a function to copy properties properties from mixin to the composed object. See official documentation on the subject.
Here I propose a way to compose objects using regular classes with no code duplication, no performance overhead, and with type checking.
Let’s imagine we have 3 capabilities (our mixins) implemented as classes. To make it more fun, each of them initialize its data differently.
and we want some animals to have these capabilities
- the Duck is a Swimmer, a Walker, and a Talker (saying coin)
- the Fish is a Swimmer and a Talker (saying bloup)
It’s not possible in Typescript to create a class that extends those three classes. But what we can do is to create an interface that extends those classes. We can even define what signature the constructore should be.
In the same file we will create a variable with same name as the interface to store a constructor for this interface. Yes it’s valid Typescript. For now let’s imagine we have a
compose function that will create this constructor function.
All we have to do now, is to find a way to create concrete classes that implements theses interfaces.
The idea is to create a constructor function, whose prototype will receive the properties of our mixins. So here is the compose functon
You can then use you Duck interface like in this sample.
What is really cool with this solution, is that mixins work as expected when reading the code:
- the properties are initialized
- the constructor is called
This is because Typescript aggregate all the initialization in the constructor function of the mixin, that we call when instantiating our composed object.
A working sample is available here: https://github.com/nch3v/typescript-mixins