TypeScript(およびJavaScript)クラスは、厳密な単一継承をサポートします。あなたはこれをすることはできません:
class User extends Tagged, Timestamped { // ERROR : no multiple inheritance}
再使用可能なコンポーネントからクラスを構築する別の方法は、mixinと呼ばれるより単純な部分クラスを組み合わせてそれらを構築することです。
そのアイデアは、機能を得るためにクラスAを拡張するクラスAの代わりに単純です。関数BはクラスA を取り、この追加された機能を持つ新しいクラスを返します。関数B
はミックスインです。
[mixinは]
コンストラクタをとり、
新機能でそのコンストラクタを拡張するクラスを作成する
新しいクラスを返す
完全な例
// Needed for all mixinstype Constructor<T = {}> = new (...args: any[]) => T;////////////////////// Example mixins////////////////////// A mixin that adds a propertyfunction Timestamped<TBase extends Constructor>(Base: TBase) {return class extends Base {timestamp = Date.now();};}// a mixin that adds a property and methodsfunction Activatable<TBase extends Constructor>(Base: TBase) {return class extends Base {isActivated = false;activate() {this.isActivated = true;}deactivate() {this.isActivated = false;}};}////////////////////// Usage to compose classes////////////////////// Simple classclass User {name = '';}// User that is Timestampedconst TimestampedUser = Timestamped(User);// User that is Timestamped and Activatableconst TimestampedActivatableUser = Timestamped(Activatable(User));////////////////////// Using the composed classes////////////////////const timestampedUserExample = new TimestampedUser();console.log(timestampedUserExample.timestamp);const timestampedActivatableUserExample = new TimestampedActivatableUser();console.log(timestampedActivatableUserExample.timestamp);console.log(timestampedActivatableUserExample.isActivated);
この例を分解してみましょう。
ミックスインはクラスを取り、それを新しい機能で拡張します。したがって、コンストラクタを定義する必要があります。簡単に:
// Needed for all mixinstype Constructor<T = {}> = new (...args: any[]) => T;
とても簡単:
// A mixin that adds a propertyfunction Timestamped<TBase extends Constructor>(Base: TBase) {return class extends Base {timestamp = Date.now();};}
これだけです🌹