如何正确使用带有 Phaser 的 Typescript 扩展类答案

【问题标题】：How to correctly use Typescript extended classes with Phaser如何正确使用带有 Phaser 的 Typescript 扩展类
【发布时间】：2017-03-15 16:54:53
【问题描述】：

我是 Javascript 和 Typescript 的新手。我用 Javascript 编写了一个简单的 Phaser 游戏，现在想用 Typescript ES2015 (ES6) 重写它。
我已经扩展了 Phaser.Game 类，这样它就可以通过它的构造函数传递一个变量。这用于创建 websocket。此套接字可以作为 Game 或 State 类型的属性存在（我在示例中对此进行了说明）。
我已经扩展了 Phaser.State 类以包含需要通过 websocket 的 .onmessage 成员函数由 websocket 数据设置的属性。

为了完整起见，我将 createWebsocket 显示为一个函数，实际上它是其中一个类的成员函数。

function createWebsocket(wsPath, callback){
    var ws = new WebSocket(wxPath);
    ws.onmessage = callback;
    return ws;
}

export class Game extends Phaser.Game {
    csocket: WebSocket;
    constructor(wsPath, container) {
    this.state.add('Boot', Boot, false);
    this.csocket = createWebsocket(wsPath, this.handleMsg);
}

export class Boot extends Phaser.State {
    csocket: WebSocket;
    constructor(){super();}
    my_value: number;
    setMyValue(value) {this.my_value = value};
    this.csocket = createWebsocket(wsPath, this.handleMsg);
}

如何将数据从扩展的 Game 类实例传递到 Boot 实例或访问 Boot 实例的 createWebsocket 成员函数？

如果我在游戏中使用以下内容；

state = this.state.getCurrentState();
state.setValue()

我得到一个（反式）编译器错误，因为 getCurrentState() 返回基类的实例而不是扩展类，即使扩展类类型已传递给 state.add 函数

我认为无法将 wsPath 传递给 Boot 类的构造函数，因为类型已传递给 .add 函数。

【问题讨论】：

标签： javascript typescript ecmascript-6 phaser-framework

【解决方案1】：

简单的答案总是最好的。所以，回答我自己的问题......

虽然示例没有清楚地显示这一点，但 this.state.add 调用不仅允许类，它还允许类实例。只需使用新的。

export class Game extends Phaser.Game {
    csocket: WebSocket;
    constructor(wsPath, container) {
        var bootState = new Boot(wsPath);
        this.state.add('Boot', bootState, false);
...

【讨论】：