1

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

// 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];
    });
  });
}

TODO:

这个方式让我想起了一个问题,接口和类的区别?(后端语言的和js在这里各有什么不同)


雨花石
410 声望19 粉丝

人生没有彩排,每天都是直播