javascript - 共享接口(interface)公共(public)功能的有效方法

标签 javascript typescript

好吧,快速免责声明,我来自 C++ 世界,在过去一个月左右的时间里只使用了 Typescript。可以公平地说,我对 Typescript 有点笨拙。

解决了这个问题,我将 Typescript 与 pixi.js 结合使用。

我用 DisplayObject 抽象了 pixi.js 显示对象界面。该接口(interface)的主要目的之一是为现实世界空间与 pixi.js 坐标系提供接口(interface)。我这样做还有其他一些原因,因为它会使处理DisplayObject如果我有一个可以使用的通用界面,那就更容易了。

一个例子DisplayObject看起来如下:

export interface DisplayObject {
    // These are in "game space" (Cartesian)
    getX(): number;
    setX(val: number): void;
    getY(): number;
    setY(val: number): void;

    // These are in "screen space" (canvas coordinates: upper left, +Y down)
    getScreenX(): number;
    setScreenX(val: number): void;
    getScreenY(): number;
    setScreenY(val: number): void;
}

然后我要做的是创建特定的显示对象,例如 implements 的 Sprite 来自DisplayObjectextends来自适当的 pixi.js 类。

例如,Sprite看起来像下面这样:

export class Sprite extends PIXI.Sprite implements DisplayObject {
}

我发现设置 x/y 值和/或屏幕 x/y 值的代码通常是相同的。但我通常无法将代码与界面关联起来。

有没有好的方法可以分享这个通用代码?或者有更好的方法使用interfaceclasses改进设计。

所有显示对象类均派生自 pixi.js 类。那些 pixi.js 类本身 extend来自PIXI.Container类(class)。

我知道如何在 C++ 和 Swift 中执行此操作,但 Typescript 不支持多重继承。或者也许 Typescript 有类似于 Swift 的 extension 的东西是吗?

最佳答案

我最终使用 Mixins 来解决这个问题。我基于这篇优秀的文章:

https://www.bryntum.com/blog/the-mixin-pattern-in-typescript-all-you-need-to-know/

关于javascript - 共享接口(interface)公共(public)功能的有效方法,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/58212316/

相关文章:

javascript - 使用 jquery 添加一些代码到元素

javascript - 是否可以在严格代码中更改标识符 `eval` 的值?

javascript - iOS 9 上的 Safari 不会触发隐藏输入文件的点击事件

javascript - XHR 中的 Grant_Type 放在哪里

angular - 如何使用工厂供应商?

javascript - 在浏览器和 Node 中的js文件中使用node-fetch

javascript - 将自定义 header 添加到 videojs 播放器源

javascript - 仅使用没有名称的方法签名声明类的接口(interface)

css - 禁用 react 额外的 div 包装器

typescript - 可观察和 xhr.upload.onprogress 事件