ES6 Mixin 与 TypeScript 中的泛型类型答案

【问题标题】：ES6 Mixin with generic type in TypeScriptES6 Mixin 与 TypeScript 中的泛型类型
【发布时间】：2017-08-22 12:50:57
【问题描述】：

我正在尝试在 TypeScript 中使用 ES6 Mixin。我所拥有的如下，它与BaseClass完美搭配。

class BaseClass {
    public foo() {}
};

interface IMyMixin {
    foo2();
}

let MyMixin = (superclass: typeof BaseClass) => class extends BaseClass implements IMyMixin {
    public foo2() {}
}

class MyBaseClass extends MyMixin(BaseClass) {

}

但是我不能在来自BaseClass 的派生类上应用MyMixin；同时，我也不能让 mixin 通用。

有没有办法让它同时适用于BaseClass 和DerivedClass？

class DerivedClass extends BaseClass {
    public bar() {}
}

class MyDerivedClass extends MyMixin(DerivedClass) {
    public something() {
// Compile Error: Property 'bar' does not exist on type 'MyDerivedClass'
        this.bar();
    }
}

// Compile Error: 'T' only refers to a type, but is being used as a value here.
let MyMixin = <T extends BaseClass>(superclass: typeof T) => class extends T implements IMyMixin {
    public foo2() {}
}

【问题讨论】：

您是否打算写class extends superclass implements IMyMixin 而不是class extends BaseClass implements IMyMixin？否则superclass变量不会在MyMixin工厂函数中使用
@Maximus 非常感谢，我没有意识到superclass 可以用于返回类型。

标签： typescript ecmascript-6 mixins

【解决方案1】：

我从TypeScript/PR#13743 找到了解决方案，并通过@Maximus 的评论对其进行了优化。

这段代码有效。原因是，在MyMixin 中，T 应该是Class（即构造函数），而不是类型。

type Constructor<T> = new (...args: any[]) => T;

class BaseClass {
    public foo() { }
};

interface IMyMixin {
    foo2();
}

// `implements IMyMixin` is optional.
let MyMixin = <T extends Constructor<BaseClass>>(superclass: T) => class extends superclass implements IMyMixin {
    public foo2() { }
}

class DerivedClass extends BaseClass {
    public bar() {}
}

class MyDerivedClass extends MyMixin(DerivedClass) {
    public something() {
        this.bar();
        this.foo();
        this.foo2();
    }
}

【讨论】：