Javascript 如何在TypeScript中将类方法附加为jQuery EventHandler

我正在将一些JavaScript代码转换为TypeScript，但我不知道jQueryEventHandler的签名应该是什么样子

这就是我在JavaScript中所做的，但被简化为更通用的术语（在这里，我有一些pub-sub或observeable模式，使用通过元素分发的自定义事件）：

在另一个原型中，我将调用trigger来通知观察者事件和至少2个数据参数（someString和somesobject）：

现在我很难用打字机来写，但我认为它应该是这样的：

export class Observer {
  private _subscribe (): void {
        this._element.bind('onItemChanged', this, this._onChangedHandler);
  }
  private _onChangedHandler(event: JQueryEventObject, someString: string, someObject: FooBarClass) {
    let that = event.data as Observer;
    if (someString === '42') {
      that.coolMethod(someObject);
    } else if (someString === '69') {
      that.otherCoolMethod(someObject);
    }
  }
}

此TypeScript未编译，但出现以下错误：

类型为“（event:JQueryEventObject，someString:string，someObject:FooBarClass）=>void”的参数不能分配给类型为“EventHandler | EventHandlerBase>”的参数。 类型“（event:JQueryEventObject，someString:string，someObject:FooBarClass）=>void”不可分配给类型“EventHandlerBase>”。 参数“event”和“t”的类型不兼容。 类型“Event”不可分配给类型“JQueryEventObject”

那么eventhandler的签名（参数类型）应该是什么样的呢

另外，如果愿意，可以使用jQuery:：on（）而不是jQuery:：bind（）重写

p.p.S.除非我真的走错了路，否则我对如何获得正确的“这个”的各种方式不感兴趣

编辑（第一次重播后）： 正如我建议的那样，我重写了打字稿以使我的问题更清楚。我知道用胖箭头符号来表示正确的“this”，但正如我之前所说的，我对这个不感兴趣。我希望我的方法是类型安全的，那么，我的handler方法的签名应该是什么样的呢？ 这确实有效：

private _subscribe (): void {
  this._element.on('onItemChanged', () => this._onChangedHandler);
}
private _onChangedHandler(event: JQueryEventObject, someString: string, someObject: FooBarClass) {
}

但后来我认为这也会起作用：

private _subscribe(): void {
  this._element.on('onItemChanged', (event: JQueryEventObject, someString: string, someObject: FooBarClass) => { this._onChangedHandler(event, someString, someObject); });
}

但是我仍然无法为获取typesafety的第一个参数获取正确的事件类型。对于“any”类型，它会编译：

private _subscribe(): void {
  this._element.on('onItemChanged', (event: any, someString: string, someObject: FooBarClass) => { this._onChangedHandler(event, someString, someObject); });
}

p.p.S.我对如何得到合适的答案的各种方法不感兴趣 除非我真的走错了路

我知道你不想听这些，但是当你处理事件时，你真的需要注意你的范围

this._element.bind('onItemChanged', this, () => {
    this._onChangedHandler();
});

我还建议转到上的

，因为
bind
已被弃用

这感觉像是一个奇怪的答案，因为我认为您已经怀疑了这两个问题了？
通过放置“any”类型并在调试器中运行，我最终在运行时发现第一个参数是“JQuery.Event”类型，当使用JQuery的类型定义时，它在TypeScript中也能正确编译。太糟糕了，tsc不能在编译时早点告诉我（或者我误解了问题中显示的错误）。
因此，它应该是这样的（不管是使用bind、fat-arrow还是您自己保存正确上下文的方式/this）：

虽然这可以编译并提供某种类型的类型安全性，但我有点失望，因为我可以使用错误的签名附加处理程序，并且它仍然可以编译。我想这就是附加事件处理程序的工作方式。至少您可以使用typesafety直接调用您的方法，并且仍然将它们用作处理程序

因此，对于遇到此问题的其他人，签名应如下所示：

export class Observer {
  private _element: JQuery;

  private _subscribe(): void {
    this._element.on('anyevent', () => this._yourOwnHandler);
  }

  private _yourOwnHandler(event: JQuery.Event, ...args: any[]): void {
  }
}

其中，“…args”可以是任何您喜欢的参数，这将为您提供所需参数的数量和类型。
这两个都是有效的备注，是的，我需要解决它们，但与我的问题无关。我感兴趣的是如何定义处理函数的参数类型。如果问题变得更清楚，我可以用这两个建议重写这个问题，但是您没有将任何数据或参数传递给处理程序，因此它没有帮助。
this._element.bind('onItemChanged', this, () => {
    this._onChangedHandler();
});

export class Observer {
  private _element: JQuery;

  private _subscribe(): void {
    this._element.on('onItemChanged', (event: JQuery.Event, someString: string, someObject: FooBarClass) => { this._onChangedHandler(event, someString, someObject); });
  }

  private _onChangedHandler(event: JQuery.Event, someString: string, someObject: FooBarClass): void {
  }
}

export class Observer {
  private _element: JQuery;

  private _subscribe(): void {
    this._element.on('anyevent', () => this._yourOwnHandler);
  }

  private _yourOwnHandler(event: JQuery.Event, ...args: any[]): void {
  }
}