Determining TypeScript Callback Type

Question

I have the following class in TypeScript:

class CallbackTest { public myCallback; public doWork(): void { //doing some work... this.myCallback(); //calling callback } } 

I use the class as follows:

 var test = new CallbackTest(); test.myCallback = () => alert("done"); test.doWork(); 

The code works, so it displays a message box as expected.

My question is: is there any type that I can provide for my field of class myCallback ? The public field myCallback is now of type any , as shown above. How to determine the signature of a callback method? Or can I just set the type of the callback type? Or can I do it? Should I use any (implicit / explicit)?

I tried something like this, but this did not work (compile-time error):

 public myCallback: (); // or: public myCallback: function; 

I could not find any explanation for this online, so I hope you can help me.

Answer 1

I just found something in the TypeScript language specification, it's pretty simple. I was pretty close.

The syntax is as follows:

 public myCallback: (name: type) => returntype; 

In my example, it will be

 class CallbackTest { public myCallback: () => void; public doWork(): void { //doing some work... this.myCallback(); //calling callback } } 

Answer 2

To take another step, you can declare a type pointer to a function signature, for example:

 interface myCallbackType { (myArgument: string): void } 

and use it as follows:

 public myCallback : myCallbackType; 

Answer 3

You can declare a new type:

 declare type MyHandler = (myArgument: string) => void; var handler: MyHandler; 

Update

The declare keyword is not required. It should be used in .d.ts files or in similar cases.

Answer 4

Here is an example - do not accept any parameters and do not return anything.

 class CallbackTest { public myCallback: {(): void;}; public doWork(): void { //doing some work... this.myCallback(); //calling callback } } var test = new CallbackTest(); test.myCallback = () => alert("done"); test.doWork(); 

If you want to accept a parameter, you can also add this:

 public myCallback: {(msg: string): void;}; 

And if you want to return a value, you can add this as well:

 public myCallback: {(msg: string): number;}; 

Answer 5

If you want to use a generic function, you can use the following. Although, it seems, it is not documented anywhere.

 class CallbackTest { myCallback: Function; } 

Answer 6

I encountered the same error while trying to add a callback to an event listener. Oddly enough, setting the EventListener callback type solved it. It looks more elegant than defining an entire function as a type, but I'm not sure if this is the right way to do this.

 class driving { // the answer from this post - this works // private callback: () => void; // this also works! private callback:EventListener; constructor(){ this.callback = () => this.startJump(); window.addEventListener("keydown", this.callback); } startJump():void { console.log("jump!"); window.removeEventListener("keydown", this.callback); } } 

Answer 7

You can use the following:

1. Enter Alias ​​(using the type keyword, a functional literal alias)
2. interface function literal

---

Here is an example of how to use them:

 type myCallbackType = (arg1: string, arg2: boolean) => number; interface myCallbackInterface { (arg1: string, arg2: boolean): number }; class CallbackTest { // ... public myCallback2: myCallbackType; public myCallback3: myCallbackInterface; public myCallback1: (arg1: string, arg2: boolean) => number; // ... }