星空网 > 软件开发 > Java

Typescript Mixins(混合)

除了惯例的面对对象的思想,另一种较流行的通过可复用组件创建类的方法是将简单的类混合到一起。你可能对这种混合的方式比较熟悉或对Scala语言的特性有理解,这种模式在JavaScript社区也有一定的人气。

混合案例

在下面的代码中,我们展示了如何在TypeScript中混合模型,看完代码之后,再分析它的执行。

// Disposable Mixinclass Disposable {  isDisposed: boolean;  dispose() {    this.isDisposed = true;  } } // Activatable Mixinclass Activatable {  isActive: boolean;  activate() {    this.isActive = true;  }  deactivate() {    this.isActive = false;  }} class SmartObject implements Disposable, Activatable {  constructor() {    setInterval(() => console.log(this.isActive + " : " + this.isDisposed), 500);  }   interact() {    this.activate();  }   // Disposable  isDisposed: boolean = false;  dispose: () => void;  // Activatable  isActive: boolean = false;  activate: () => void;  deactivate: () => void;}applyMixins(SmartObject, [Disposable, Activatable]) var smartObj = new SmartObject();setTimeout(() => smartObj.interact(), 1000); ////////////////////////////////////////// 在你代码的某处////////////////////////////////////////function applyMixins(derivedCtor: any, baseCtors: any[]) {  baseCtors.forEach(baseCtor => {    Object.getOwnPropertyNames(baseCtor.prototype).forEach(name => {      derivedCtor.prototype[name] = baseCtor.prototype[name];    })  }); }

理解案例

该代码例子刚开始的两个类是将被作为混合部分的类。你可以看到,每一类都有特定的功能。之后我们将这两个类混合成一个同时拥有这两个类的功能的新类。

// Disposable Mixinclass Disposable {  isDisposed: boolean;  dispose() {    this.isDisposed = true;  } } // Activatable Mixinclass Activatable {  isActive: boolean;  activate() {    this.isActive = true;  }  deactivate() {    this.isActive = false;  }}

接下来,我们创建一个新的类,并将这两个类混合到这个新的类中。详细的看看它是如何做的:

class SmartObject implements Disposable, Activatable {

你可能会注意到的第一件事是我们使用了"implements",而不是"extends"。这样做是将类作为接口对待,只使用了"Disposable"和"Activatable"后面的类型,而不是实现这两个接口。这也意味着我们需要在类中实现这两个接口,但这恰恰是我们想通过混合来避免的问题。

为了满足这些需求,我们为这些将要混合进来的属性创建占位符和其类型。这样可以让编译器认识到这些成员在运行时是可用的。这么做能达到混合的利益,即使我们需要提前编写成员的占位符及其类型。

// DisposableisDisposed: boolean = false;dispose: () => void;// ActivatableisActive: boolean = false;activate: () => void;deactivate: () => void;

最后,我们将这两个类混合进新的类,创建所有的实现方式。

applyMixins(SmartObject, [Disposable, Activatable])

最后,我们创建一个帮助我们做混合的辅助函数。这个函数遍历每个混合类上的每个属性,并且将他们拷贝到混合后的类中,填充在之前所留的占位符并且将其实现。

function applyMixins(derivedCtor: any, baseCtors: any[]) {  baseCtors.forEach(baseCtor => {    Object.getOwnPropertyNames(baseCtor.prototype).forEach(name => {      derivedCtor.prototype[name] = baseCtor.prototype[name];    })  }); }




原标题:Typescript Mixins(混合)

关键词:ip

ip
*特别声明:以上内容来自于网络收集,著作权属原作者所有,如有侵权,请联系我们: admin#shaoqun.com (#换成@)。

跨境电商如何加盟:https://www.goluckyvip.com/tag/36160.html
跨境电商如何扩展:https://www.goluckyvip.com/tag/36161.html
跨境电商如何申请:https://www.goluckyvip.com/tag/36162.html
跨境电商如何赚钱:https://www.goluckyvip.com/tag/36163.html
跨境电商如何做:https://www.goluckyvip.com/tag/36164.html
跨境电商入驻:https://www.goluckyvip.com/tag/36165.html
三亚有哪些酒店值得入住?:https://www.vstour.cn/a/366173.html
零售晚报:丽人丽妆2023年扭亏为盈 玉容初、美壹堂等自有品牌增速超40% :https://www.kjdsnews.com/a/1836649.html
相关文章
我的浏览记录
最新相关资讯
海外公司注册 | 跨境电商服务平台 | 深圳旅行社 | 东南亚物流