混入是如何工作的?

该模式依赖于使用具有类继承的泛型来扩展基类。TypeScript 最好的 mixin 支持是通过类表达式模式完成的。您可以阅读有关此模式在 JavaScript 此处 中如何工作的更多信息。

The pattern relies on using generics with class inheritance to extend a base class. TypeScript's best mixin support is done via the class expression pattern. You can read more about how this pattern works in JavaScript here.

n87HhTVgCW7CP6bIWp2pze6ANI/qMYAYzLo0AD85fMDfd8Ym6NNuwTW4SbPWlOTntUALhCzHlK4J4VxwxECo/MlJYRO6QV5FwjR37RirM9/iZDHl1ncbllQpTa7Trya1/L8EZSVaT1wVQ3fwWf1HNVQyEZOEWWn7TVT/vlLTalVOHPVX7FvT2ooxCgbWkWbns6Buugp/SQyLtzZqI0BKRpb5EkW+reW8p6Qzq19+o44=

class Sprite {
  name = "";
  x = 0;
  y = 0;

  constructor(name: string) {
    this.name = name;
  }
}

J6v+xL9tcI7xR7N2DTz4aO++59GCOb86a4xri623wlzt9IOGnSVL/+hRXqW+ovYe8jZr1RZ4XT29zNjIkO6WQuTkpQUj2mqT52ipFZDh08SuibjifJ/JaT2WuYokBSjspuYRJQ8DTgjRzxQ/tTjYhHEFQreK52TRN1HEOTIHi4TkhaHBiLwHQjEfcrlN17eWvplcfbqssFNWPkO257r7qevGMvu5GxKbzZrVJQeeBbrYkjjJqpEgVNN8g0rtr3GE1GlO0ppa1qPFXIEmTIe1qXbPJTFnfvySZ0jz3DP1Ewc=

// To get started, we need a type which we'll use to extend
// other classes from. The main responsibility is to declare
// that the type being passed in is a class.

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<TBase extends Constructor>(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;
    }
  };
}

PQ1A8DvzkkPbsAdRyoG/WWrbdrzKxEFZZ+1Y0Gqh6BI+EDUsvpl4wCXCTFfUifDtsmuw4BFgOsxg0nPUZl18oaWIYi1HOT7QKFbBGorIzjhmsOlVHCT6GZLbbV+YRVUuzvZ7iFUeRo4WEuh2JFUHR8Z9WNzboX8Ccx8E4rweJDfNC8CS7FFVQ6kR7iRem3OyAvZ02RMnEQuIR7cMwKkham97/14ehmMGTKXS5vMzvV6VCAoqetB+floyCXyBr4ilEfYQpuQ8qHX4wa4iwk3mUZv658dE/KoZGVErclRyUZs=

class Sprite {
  name = "";
  x = 0;
  y = 0;

  constructor(name: string) {
    this.name = name;
  }
}
type Constructor = new (...args: any[]) => {};
function Scale<TBase extends Constructor>(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;
    }
  };
}
// Compose a new class from the Sprite class,
// with the Mixin Scale applier:
const EightBitSprite = Scale(Sprite);

const flappySprite = new EightBitSprite("Bird");
flappySprite.setScale(0.8);
console.log(flappySprite.scale);