Определение типа обратного вызова TypeScript

У меня есть следующий класс в TypeScript:

class CallbackTest
{
    public myCallback;

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

Я использую класс, как это:

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

Код работает, поэтому он отображает окно сообщения, как и ожидалось.

Мой вопрос: есть ли какой-нибудь тип, который я могу предоставить для своего поля класса myCallback? Прямо сейчас, публичное поле myCallbackимеет тип, anyкак показано выше. Как я могу определить сигнатуру метода обратного вызова? Или я могу просто установить тип для какого-то типа обратного вызова? Или я могу сделать ничего из этого? Должен ли я использовать any(неявный / явный)?

Я пробовал что-то вроде этого, но это не сработало (ошибка времени компиляции):

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

Я не смог найти объяснения этому в Интернете, поэтому надеюсь, что вы мне поможете.

Я только что нашел что-то в спецификации языка TypeScript, это довольно просто. Я был довольно близко

синтаксис следующий:

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

В моем примере это было бы

class CallbackTest
{
    public myCallback: () => void;

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

Чтобы пойти еще дальше, вы можете объявить указатель типа на сигнатуру функции, например:

interface myCallbackType { (myArgument: string): void }

и используйте это так:

public myCallback : myCallbackType;

Вы можете объявить новый тип:

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

var handler: MyHandler;

Обновить.

declareКлючевое слово не нужно. Его следует использовать в файлах .d.ts или в подобных случаях.

Вот пример - не принимать параметры и ничего не возвращать.

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();

Если вы хотите принять параметр, вы также можете добавить его:

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

И если вы хотите вернуть значение, вы можете добавить это также:

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

Если вы хотите универсальную функцию, вы можете использовать следующее. Хотя, кажется, это нигде не задокументировано.

class CallbackTest {
  myCallback: Function;
}   

Вы можете использовать следующее:

1. Тип Alias ​​(используя typeключевое слово, псевдоним функции литерал)
2. Интерфейс
3. Функция Literal

Вот пример того, как их использовать:

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;

    // ...

}

Я столкнулся с той же ошибкой при попытке добавить обратный вызов для прослушивателя событий. Как ни странно, установка типа обратного вызова в EventListener решила это. Это выглядит более элегантно, чем определение всей сигнатуры функции как типа, но я не уверен, что это правильный способ сделать это.

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);
    }
}

Я немного опоздал, но, так как некоторое время назад в TypeScript вы могли определить тип обратного вызова с

type MyCallback = (KeyboardEvent) => void;

Пример использования:

this.addEvent(document, "keydown", (e) => {
    if (e.keyCode === 1) {
      e.preventDefault();
    }
});

addEvent(element, eventName, callback: MyCallback) {
    element.addEventListener(eventName, callback, false);
}