TypeScript 自定义事件监听器

我认为我在这里的理解中遗漏了一些相当重要的东西，所以也许一点解释也会非常有帮助。

我有一堂课，如下：

class Entity {
    protected pos: number = [0,0];

    ...

    public setPos(x: number, y: number) {
        this.pos = [x, y];
    }
}

想要类似的东西

class EntityPositionListener {
    //do stuff when an Entity position changes
}

我也有后裔Entity班级。因此，任何时候，任何后代Entity or Entity本身改变了pos变量（在给定的实例中），我想了解它，以便我可以更新地图上的位置，以及捕获实例，以便理论上我可以对该实例执行其他操作。

我注意到 Firefox 有这个功能Object.watch()命令，我发现了一个“跨浏览器”解决方案，有人在另一个问题中发布了 - 无济于事 - 我尝试“包装”Entity类处于初始化后阶段，但后者最终会覆盖Entity类或创建无限循环，所以我显然在某个地方错过了要点。如果包装是答案，我该如何在 TypeScript 中做到这一点？ JS 版本创建了循环或不起作用。

//This created an infinite loop in runtime, but more importantly overwrote the Entity class
function EntityListener(name) {
    cout(name);
}
var oldEntity = Entity;
function Entity(name) {
    if (typeof EntityListener === "function") {
        EntityListener(name);
    }

    oldEntity(name);
}

理想情况下，我想听听给定类的几件事——例如在游戏更新循环中——这个特殊情况仅用于演示。我发现了无数的链接，其中许多是 JS 而不是明确的 TypeScript，所以我真的很想要一个 TypeScript 解决方案以及一些关于正在发生的事情的解释。我只是从根本上不明白如何解决这个问题。

EDIT

如果这是问题的更好版本，也许更简单，我如何倾听Entity.setPos()被称为？

对象观察 https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/observe将最有可能dropped https://esdiscuss.org/topic/an-update-on-object-observe. 对象.watch https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/watch仅在 Gecko 中受支持，因此除非您仅针对 Firefox，否则请勿在代码中使用它。

这意味着您必须编写自己的事件发射。如果您喜欢，可以使用 TypeScript getter 和 setter：

class Entity {
    private entitityListener:EntityPositionListener;
    private _pos:number[] = [];

    get pos():number[] {
        return this._pos;
    }
    set pos(value:number[]) {            
        this._pos = value;

        if (this.entitityListener) {
            this.entitityListener.reportEvent('pos', value);
        }
    }
}

class SuperEntity extends Entity {

}

let superEntity = new SuperEntity();
superEntity.pos = [1,2]; // this will call 'this.entitityListener.reportEvent()' and you don't need superEntity.setPos([1,2]);

其转换为：

var __extends = (this && this.__extends) || function (d, b) {
    for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p];
    function __() { this.constructor = d; }
    d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
};
var Entity = (function () {
    function Entity() {
        this._pos = [];
    }
    Object.defineProperty(Entity.prototype, "pos", {
        get: function () {
            return this._pos;
        },
        set: function (value) {
            this._pos = value;
            if (this.entitityListener) {
                this.entitityListener.reportEvent('pos', value);
            }
        },
        enumerable: true,
        configurable: true
    });
    return Entity;
})();
var SuperEntity = (function (_super) {
    __extends(SuperEntity, _super);
    function SuperEntity() {
        _super.apply(this, arguments);
    }
    return SuperEntity;
})(Entity);
var superEntity = new SuperEntity();
superEntity.pos = [1, 2];

您可以使用对象.defineProperty() https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/defineProperty#Enumerable_attribute定义 getter 和 setter，这意味着您可以定义 setter 来包含对EntityListener method.