메서드 파라미터에서 사용되는 함수 콜백의 유형(유니버설타입이 아닌 임의의 함수타입)을 정의하는 방법

메서드 파라미터에서 사용되는 함수 콜백의 유형(유니버설타입이 아닌 임의의 함수타입)을 정의하는 방법

현재 유형 정의는 다음과 같습니다.

interface Param {
    title: string;
    callback: any;
}

다음과 같은 것이 필요합니다.

interface Param {
    title: string;
    callback: function;
}

두 번째는 안 받아주고 있어요.

글로벌 타입Function이 목적을 달성합니다.

또한 0 인수를 사용하여 이 콜백을 호출하고 반환값을 무시하는 경우,() => void는 인수를 사용하지 않는 모든 함수와 일치합니다.

v1.4의 타이프스크립트에는type타입 에일리어스를 선언하는 키워드(에일리어스)typedef(C/C++)로 설정합니다.콜백 타입은 다음과 같이 선언할 수 있습니다.

type CallbackFunction = () => void;

인수를 받지 않고 아무것도 반환하지 않는 함수를 선언합니다.모든 유형의 인수를 0개 이상 사용하고 아무것도 반환하지 않는 함수는 다음과 같습니다.

type CallbackFunctionVariadic = (...args: any[]) => void;

그러면 예를 들어 이렇게 말할 수 있습니다.

let callback: CallbackFunctionVariadic = function(...args: any[]) {
  // do some stuff
};

임의의 수의 인수를 사용하여 임의의 값(void 포함)을 반환하는 함수를 원하는 경우:

type CallbackFunctionVariadicAnyReturn = (...args: any[]) => any;

다음과 같이 몇 가지 필수 인수와 추가 인수 세트(문자열, 숫자, 추가 arg 세트 등)를 지정할 수 있습니다.

type CallbackFunctionSomeVariadic =
  (arg1: string, arg2: number, ...args: any[]) => void;

이것은 EventEmitter 핸들러 등에 도움이 됩니다.

타입 에일리어스로 모든 것을 정리하려고 하면, 흥분해 조합의 문제에 부딪힐 수 있지만, 이 방법으로 함수를 원하는 만큼 강하게 입력할 수 있습니다.

Ryan의 답변에 따라 당신이 찾고 있는 인터페이스는 다음과 같이 정의되어 있다고 생각합니다.

interface Param {
    title: string;
    callback: () => void;
}

인터페이스에서는 다양한 방법으로 기능 타입을 정의할 수 있습니다.

1. 일반적인 방법:

export interface IParam {
  title: string;
  callback(arg1: number, arg2: number): number;
}

2. 속성 구문을 사용하는 경우,

export interface IParam {
  title: string;
  callback: (arg1: number, arg2: number) => number;
}

3. 먼저 함수 유형을 선언하면

type MyFnType = (arg1: number, arg2: number) => number;

export interface IParam {
  title: string;
  callback: MyFnType;
}

사용은 매우 간단합니다.

function callingFn(paramInfo: IParam):number {
    let needToCall = true;
    let result = 0;
   if(needToCall){
     result = paramInfo.callback(1,2);
    }

    return result;
}

4. 함수 유형 리터럴도 선언할 수 있습니다.즉, 함수는 다른 함수를 파라미터로 받아들일 수 있습니다.파라미터화 함수는 콜백이라고도 불립니다.

export interface IParam{
  title: string;
  callback(lateCallFn?:
             (arg1:number,arg2:number)=>number):number;

}

콜백을 받아들이는 함수의 예를 다음에 나타냅니다.

const sqk = (x: number, callback: ((_: number) => number)): number => {
  // callback will receive a number and expected to return a number
  return callback (x * x);
}

// here our callback will receive a number
sqk(5, function(x) {
  console.log(x); // 25
  return x;       // we must return a number here
});

콜백의 수익률에 관심이 없는 경우(대부분의 사람들은 콜백의 유효 활용 방법을 모른다),void

const sqk = (x: number, callback: ((_: number) => void)): void => {
  // callback will receive a number, we don't care what it returns
  callback (x * x);
}

// here our callback will receive a number
sqk(5, function(x) {
  console.log(x); // 25
  // void
});

주의: 이 시그니처는callback파라미터...

const sqk = (x: number, callback: ((_: number) => number)): number

콜백 파라미터의 이름을 지정해야 하기 때문에 이것은 TypeScript의 결함이라고 생각합니다.이 경우,_내부에서는 사용할 수 없기 때문에sqk★★★★★★ 。

하지만 이렇게 하면

// danger!! don't do this
const sqk = (x: number, callback: ((number) => number)): number

유효한 TypeScript이지만 다음과 같이 해석됩니다.

// watch out! typescript will think it means ...
const sqk = (x: number, callback: ((number: any) => number)): number

즉, TypeScript는 파라미터 이름을 다음과 같이 간주합니다.number은 ""입니다.any이것은 분명히 우리가 의도한 것이 아닙니다만, 유감스럽게도 TypeScript는 그렇게 동작합니다.

따라서 함수 매개 변수를 입력할 때 매개 변수 이름을 제공하는 것을 잊지 마십시오.바보같이 보일지 모르지만

추상 함수 유형에는 4가지가 있으며, 함수가 인수를 받는지, 받지 않는지, 데이터를 반환할지 여부를 알고 있을 때 별도로 사용할 수 있습니다.

export declare type fEmptyVoid = () => void;
export declare type fEmptyReturn = () => any;
export declare type fArgVoid = (...args: any[]) => void;
export declare type fArgReturn = (...args: any[]) => any;

다음과 같습니다.

public isValid: fEmptyReturn = (): boolean => true;
public setStatus: fArgVoid = (status: boolean): void => this.status = status;

모든 함수 유형으로 한 가지 유형만 사용하려면 다음과 같이 모든 추상 유형을 함께 결합할 수 있습니다.

export declare type fFunction = fEmptyVoid | fEmptyReturn | fArgVoid | fArgReturn;

그 후 다음과 같이 사용합니다.

public isValid: fFunction = (): boolean => true;
public setStatus: fFunction = (status: boolean): void => this.status = status;

위의 예에서는 모든 것이 정확합니다.그러나 아래의 사용 예는 대부분의 코드 에디터의 관점에서 올바르지 않습니다.

// you can call this function with any type of function as argument
public callArgument(callback: fFunction) {

    // but you will get editor error if call callback argument like this
    callback();
}

편집자에 대한 올바른 문의는 다음과 같습니다.

public callArgument(callback: fFunction) {

    // pay attention in this part, for fix editor(s) error
    (callback as fFunction)();
}

TypeScript ESLint 플러그인에는 권장되는 규칙 ban-type(오류) 및 no-explicit-any(warn)가 있습니다.

Function이 거의

이러한 규칙에 따라 최선의 해결책은 다음과 같습니다.

callback: (...args: unknown[]) => unknown

이게 도움이 됐으면 좋겠는데...

interface Param {
    title: string;
    callback: (error: Error, data: string) => void;
}

또는 기능 중

let myfunction = (title: string, callback: (error: Error, data: string) => void): string => {

    callback(new Error(`Error Message Here.`), "This is callback data.");
    return title;

}

타이프스크립트:메서드 파라미터에서 사용되는 함수 콜백의 유형을 정의하려면 어떻게 해야 합니까?

콜백을 1) 함수 속성 또는 2) 메서드로 선언할 수 있습니다.

interface ParamFnProp {
    callback: (a: Animal) => void; // function property
}

interface ParamMethod {
    callback(a: Animal): void; // method
}

TS 2.6 이후 중요한 입력 차이가 있습니다.

보다 강력한("사운드") 타입을--strict ★★★★★★★★★★★★★★★★★」--strictFunctionTypes모드(함수 속성이 선언된 경우).예를 들어 보겠습니다.

const animalCallback = (a: Animal): void => { } // Animal is the base type for Dog
const dogCallback = (d: Dog): void => { } 

// function property variant
const param11: ParamFnProp = { callback: dogCallback } // error: not assignable
const param12: ParamFnProp = { callback: animalCallback } // works

// method variant
const param2: ParamMethod = { callback: dogCallback } // now it works again ...

기술적으로 말하면, 메서드는 이변수이며 함수 속성은 그 논거에 반한다.strictFunctionTypes메서드는 다음과 같은 빌트인 타입과 조합하여 좀 더 실용적이기 위해 (음향적이지 않더라도) 보다 광범위하게 체크됩니다.Array.

요약

• 함수 속성과 메서드 선언 사이에 유형 차이가 있습니다.
• 가능한 경우 더 강력한 유형에 대한 함수 특성 선택

놀이터 샘플코드

막 타이프스크립트에 타이프스크립트를 것을 에 알 수 같은 하기 위해 타이프스크립트interface.

Stack Overflow와 Git Hub 문제에 대한 몇 가지 답변을 살펴본 후, 저는 마침내 같은 문제에 대해 누구에게나 도움이 될 수 있는 해결책을 찾았습니다.

은 ' 종류'로 할 수 .(arg0: type0) => returnType다른 함수의 매개 변수 목록에서 이 유형 정의를 사용할 수 있습니다.

function runCallback(callback: (sum: number) => void, a: number, b: number): void {
    callback(a + b);
}

// Another way of writing the function would be:
// let logSum: (sum: number) => void = function(sum: number): void {
//     console.log(sum);
// };
function logSum(sum: number): void {
    console.log(`The sum is ${sum}.`);
}

runCallback(logSum, 2, 2);

언급URL : https://stackoverflow.com/questions/29689966/how-to-define-type-for-a-function-callback-as-any-function-type-not-universal