javascript - 将回调函数分配给变量并在高阶函数之外调用

Question

我希望将回调函数分配给组件变量...例如

...
export class MyComponent {
       private myCompVar: any;

       myFunc = function(callback: (number) => void): void {
              this.myCompVar = callback;
       }
}

...然后稍后从 MyComponent 中的另一个函数中调用此回调函数。例如:

...
export class MyComponent {
       private myCompVar: any;
       ...
       myOtherFunc(event): void {
               ...
               this.myCompVar(callbackParam);
       }
}

但是，当我像上面那样实现此操作时，当我尝试在“myOtherFunc”内部调用“this.myCompVar”时，会出现错误，提示“this.myCompVar”未定义。这让我很困惑，因为我已经确认回调已在“myFunc”中正确设置，并且其类型为“function”。正如预期的那样，在调用“myFunc”并返回后，也会调用“myOtherFunc”。

非常感谢任何帮助!

Answer 1

通过使用function，您将失去正确的this上下文。我建议改用 lambda(粗箭头函数)，它可以正确绑定(bind)到正确的 this 上下文:

myFunc = (callback: (number) => void): void => {
    this.myCompVar = callback;
}