typescript---mixins

除了传统的面向对象继承方式,还流行一种经过可重用组件建立类的方式,就是联合另外一个简单类的代码。app

// Disposable Mixin
class Disposable {
  isDisposed: boolean;
  dispose() {
    this.isDisposed = true;
  }
}

// Activatable Mixin
class Activatable {
  isActive: boolean;
  activate () {
    this.isActive = true;
  }
  deactivate () {
    this.isActive = false;
  }
}

// SmartObject这个类结合了这两个mixins,不用extends,而是使用implements,。把类当成接口,仅使用两个mixins类的类型而非实现。这意味着咱们须要在类里面实现接口。可是这是咱们在用mixins时想避免的。因此咱们能够为将要mixins进来的属性方法建立出占位属性。
class SmartObject implements Disposable, Activatable {
  constructor(){
    setInterval(() => {
      console.log(`${this.isActive} : ${this.isDisposed}`);
    }, 500);
  }

  interact () {
    this.activate();
  }

  isDisposed: boolean = false;
  dispose: () => void;

  isActive: boolean = false;
  activate: () => void;
  deactivate: () => void;
}

// 把mixins混入定义的类,完成所有实现部分
applyMixins(SmartObject, [Disposable, Activatable]);

let smartObj = new SmartObject();
setTimeout(() => {
  smartObj.interact()
}, 1000);


// 建立帮助函数,帮咱们作混入操做。会遍历mixins上的全部属性,并复制到目标上去,把以前的占位属性替换成真正的实现代码。
function applyMixins (deriveCtor: any, baseCtors: any[]) {
  baseCtors.forEach(baseCtor => {
    Object.getOwnPropertyNames(baseCtor.prototype).forEach(name => {
      deriveCtor.prototype[name] = baseCtor.prototype[name];
    });
  });
}
本站公众号
   欢迎关注本站公众号,获取更多信息