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. 별명 유형 ( type키워드 사용 , 함수 리터럴 별명 지정)
2. 상호 작용
3. 함수 리터럴

사용 방법의 예는 다음과 같습니다.

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