CODEWITHSUNDEEP
angulartypescript
humbleCoder
humbleCoder

Reputation: 685

Cannot understand the Typescript syntax

I am new to Typescript and need help in understanding some code.

code :

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

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

this.mgr.signinSilentCallback() calls the 'then' function. I want to pass the callback function as an arugment in the addSilentCallBackHandler method. However I am confused about the syntax. The return type seems to a function which again returns a fucntion ?? Can anyone please explain the callback function.

The mgr btw is the 'UserManager' which is in the OidcClient, which used for jwt token handling.

Upvotes: 0

Views: 128

Answers (2)

hansmaad
hansmaad

Reputation: 18905

The callback function returns a union type. It will return a function (of type (value:any) => void) OR a PromiseLike<void> object. From the implementation we see, that it actually returns a function. This function is passed to then and will be called once the Promise that is returned from signinSilentCallback() was resolved.

What will happen is: signinSilentCallback() returns a Promise and executes some task asynchronously, probably it performs some http requests. We tell the Promise to execute the result of callback() once it is resolved. When the async process finished, the Promise gets resolved and console.debug("callback") will be executed.

To make the example more complete, we could add another return path to callback() that actually returns a 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();
        });
    }
}

If you don't have the need to make this distinction, it's probably much easier to directly pass a function as callback, without creating it in another function.

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

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

Upvotes: 3

Kagiso Marvin Molekwa
Kagiso Marvin Molekwa

Reputation: 979

mgr.signinSilentCallback().then is a future which sets the on complete handler (which is function - with some parameter value).

You probably want to add the callback handler like so this.mgr.signinSilentCallback().then(callback) in that way you are passing in the function (reference). Because if you just call it like this this.mgr.signinSilentCallback().then(callback()) then you are passing in the result of the function (which is of type Promise).

And your callback should probably not return a further function, and it should just handle the response from the Promise.

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

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

Upvotes: 2

Related Questions