Mixins

除了传统的 OO 层次结构，另一种从可重用组件构建类的流行方法是通过组合更简单的部分类来构建它们。 您可能熟悉 Scala 等语言的 mixin 或特征的想法，并且该模式在 JavaScript 社区中也很流行。

模式依赖于使用具有类继承的泛型来扩展基类。 TypeScript 最好的 mixin 支持是通过类表达式模式完成的。

看一个例子

class Sprite {

 name = "";

 x = 0;

 y = 0;

 constructor(name: string) {

   this.name = name;

 }

}

type Constructor = new (...args: any[]) => {};

// This mixin adds a scale property, with getters and setters

// for changing it with an encapsulated private property:

function Scale(Base: TBase) {

 return class Scaling extends Base {

   // Mixins may not declare private/protected properties

   // however, you can use ES2020 private fields

   _scale = 1;

   setScale(scale: number) {

     this._scale = scale;

   }

   get scale(): number {

     return this._scale;

   }

 };

}

const EightBitSprite = Scale(Sprite);

const flappySprite = new EightBitSprite("Bird");

flappySprite.setScale(0.8);

console.log('Ethan:' ,flappySprite.scale);

本例子和我之前的文章TypeScript 类装饰器的一个例子和使用单步调试搞清楚其运行原理其实很类似，只是没有使用装饰器语法罢了。

使用Scale 对 Sprite 进行装配，传入的是 Class Sprite 的定义：

Constrained Mixins

我们可以对上述 Mixins 做一些改造和增强。

在上面的形式中，mixin 没有类的基础知识，这会使创建你想要的设计变得困难。

比如，使用上面的 mixin，我们可以给任意的 Class 添加 _scale 属性。