TypeScript geri arama türünü tanımlama

TypeScript'te şu sınıfı aldım:

class CallbackTest
{
    public myCallback;

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

Sınıfı şu şekilde kullanıyorum:

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

Kod çalışır, bu nedenle beklendiği gibi bir mesaj kutusu görüntüler.

Sorum şu: Sınıf alanım için sağlayabileceğim herhangi bir tür var mı myCallback? Şu anda, kamu alanı myCallbacktiptedir anyyukarıda gösterildiği gibi. Geri aramanın yöntem imzasını nasıl tanımlayabilirim? Yoksa türü bir tür geri arama türüne ayarlayabilir miyim? Yoksa bunlardan daha net yapabilir miyim? Kullanmam gerekiyor anymu (örtük / açık)?

Böyle bir şey denedim, ama işe yaramadı (derleme zamanı hatası):

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

Bu konuda çevrimiçi bir açıklama bulamadım, umarım bana yardımcı olabilirsiniz.

Sadece TypeScript dil spesifikasyonunda bir şey buldum, oldukça kolay. Oldukça yakındım.

sözdizimi aşağıdaki gibidir:

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

Örneğimde,

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

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

Bir adım daha ileri gitmek için, aşağıdaki gibi bir işlev imzasına bir tür işaretçisi bildirebilirsiniz:

interface myCallbackType { (myArgument: string): void }

ve şu şekilde kullanın:

public myCallback : myCallbackType;

Yeni bir tür bildirebilirsiniz:

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

var handler: MyHandler;

Güncelleme.

declareAnahtar kelime gerekli değildir. .D.ts dosyalarında veya benzer durumlarda kullanılmalıdır.

İşte bir örnek - parametre kabul etmemek ve hiçbir şey döndürmemek.

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

Bir parametreyi kabul etmek istiyorsanız, bunu da ekleyebilirsiniz:

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

Ve bir değer döndürmek istiyorsanız, bunu da ekleyebilirsiniz:

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

Genel bir işlev istiyorsanız, aşağıdakileri kullanabilirsiniz. Her ne kadar hiçbir yerde belgelenmemiş gibi görünüyor.

class CallbackTest {
  myCallback: Function;
}   

Aşağıdakileri kullanabilirsiniz:

1. Diğer Ad yazın ( typeanahtar sözcüğü kullanarak , bir işlev değişmezini takma)
2. Arayüz
3. İşlev Değişmezi

Bunların nasıl kullanılacağına dair bir örnek:

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;

    // ...

}

Bir olay dinleyicisine geri arama eklemeye çalışırken aynı hatayla karşılaştım. Garip bir şekilde, geri arama türünü EventListener olarak ayarlamak sorunu çözdü. Tüm işlev imzasını bir tür olarak tanımlamaktan daha zarif görünüyor, ancak bunun doğru yolu olup olmadığından emin değilim.

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

Biraz geç kaldım, ancak TypeScript'te bir süre önce geri arama türünü tanımlayabilirsiniz.

type MyCallback = (KeyboardEvent) => void;

Kullanım örneği:

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

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