无法理解打字稿语法

时间:2019-11-18 09:34:23

标签: angular typescript

我是Typescript的新手,需要帮助来理解一些代码。

代码:

addSilentCallBackHandler(): void {
  this.mgr.signinSilentCallback().then(callback());    
}

function callback(): (value: any) => void | PromiseLike<void> {
  return (data: any) => {
    console.debug("callback");
  };
}

this.mgr.signinSilentCallback()调用'then'函数。我想在addSilentCallBackHandler方法中作为补充传递回调函数。但是我对语法感到困惑。返回类型似乎是一个函数,该函数再次返回fucntion?谁能解释一下回调函数。

mgr btw是OidcClient中的“ UserManager”,用于处理jwt令牌。

2 个答案:

答案 0 :(得分:3)

callback函数返回一个union type。它将返回一个函数(类型为(value:any) => void)或一个PromiseLike<void>对象。从实现中我们可以看到,它实际上返回了一个函数。此函数将传递给then,一旦从signinSilentCallback()返回的Promise被解决,就会调用该函数。

将发生的情况是:signinSilentCallback()返回一个Promise并异步执行一些任务,可能执行了一些http请求。我们告诉Promise一旦解决callback()的结果。异步过程完成后,Promise将得到解决,console.debug("callback")将被执行。

为使示例更完整,我们可以向callback()添加另一个返回路径,该路径实际上返回一个PromiseLike

function callback(): ((value: any) => void) | PromiseLike<void> {
    // It can return both:
    if (/*...*/) {
        // a ((value: any) => void)
        return (data: any) => {
            console.debug("callback");
        };
    } else {
        // or a PromiseLike<void>
        return new Promise<void>((resolve) => {
            console.debug("callback 2");
            resolve();
        });
    }
}

如果您不需要进行区分,那么直接将一个函数作为回调传递而无需在另一个函数中创建它可能会容易得多。

addSilentCallBackHandler(): void {
   this.mgr.signinSilentCallback().then(callback);
}

function callback() {
   console.log('callback');
}

答案 1 :(得分:2)

mgr.signinSilentCallback().then是一个将来的版本,它将设置on完全处理程序(它是函数-具有一些参数值)。

您可能想要像这样this.mgr.signinSilentCallback().then(callback)那样添加回调处理程序,即您要传入函数(引用)。因为如果您只是像这样this.mgr.signinSilentCallback().then(callback())来调用它,那么您将传递函数的结果(类型为Promise)。

您的回调可能不应该返回其他函数,而应该只处理Promise的响应。

addSilentCallBackHandler(): void {
      this.mgr.signinSilentCallback().then(callback);    
  }

callback(value: any): void {
    console.debug("callback");
}