I've got the following class in TypeScript:
class CallbackTest
{
public myCallback;
public doWork(): void
{
//doing some work...
this.myCallback(); //calling callback
}
}
I am using the class like this:
var test = new CallbackTest();
test.myCallback = () => alert("done");
test.doWork();
The code works, so it displays a messagebox as expected.
My question is: Is there any type I can provide for my class field myCallback
? Right now, the public field myCallback
is of type any
as shown above. How can I define the method signature of the callback? Or can I just set the type to some kind of callback-type? Or can I do nether of these? Do I have to use any
(implicit/explicit)?
I tried something like this, but it did not work (compile-time error):
public myCallback: ();
// or:
public myCallback: function;
I couldn't find any explanation to this online, so I hope you can help me.
This question is related to
types
callback
typescript
Here is an example - accepting no parameters and returning nothing.
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 add that too:
public myCallback: {(msg: string): void;};
And if you want to return a value, you can add that also:
public myCallback: {(msg: string): number;};
To go one step further, you could declare a type pointer to a function signature like:
interface myCallbackType { (myArgument: string): void }
and use it like this:
public myCallback : myCallbackType;
If you want a generic function you can use the following. Although it doesn't seem to be documented anywhere.
class CallbackTest {
myCallback: Function;
}
I came across the same error when trying to add the callback to an event listener. Strangely, setting the callback type to EventListener solved it. It looks more elegant than defining a whole function signature as a type, but I'm not sure if this is the correct 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);
}
}
I'm a little late, but, since some time ago in TypeScript you can define the type of callback with
type MyCallback = (KeyboardEvent) => void;
Example of use:
this.addEvent(document, "keydown", (e) => {
if (e.keyCode === 1) {
e.preventDefault();
}
});
addEvent(element, eventName, callback: MyCallback) {
element.addEventListener(eventName, callback, false);
}
You can declare a new type:
declare type MyHandler = (myArgument: string) => void;
var handler: MyHandler;
The declare
keyword is not necessary. It should be used in the .d.ts files or in similar cases.
You can use the following:
type
keyword, aliasing a 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;
// ...
}
Source: Stackoverflow.com