首页 文章

Typescript：如何为方法参数中使用的函数回调（如任何函数类型，而不是通用任何函数）定义类型

提问于
浏览 次
189

目前我的类型定义为：

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

我需要这样的东西：

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

但第二个不被接受 .

javascript typescript

6 回答

  • 9

    全局类型 Function 用于此目的 .

    此外，如果您打算使用0参数调用此回调并忽略其返回值，则类型 () => void 将匹配所有不带参数的函数 .

    回复于
  • 123

    v1.4中的Typescript具有 type 关键字，该关键字声明了一个类型别名（类似于C / C中的 typedef ） . 您可以声明您的回调类型：

    type CallbackFunction = () => void;

    它声明了一个不带参数的函数，并且不返回任何内容 . 接受任何类型的零个或多个参数并且不返回任何内容的函数将是：

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

    然后你可以说，例如，

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

    如果你想要一个带有任意数量参数并返回任何东西的函数（包括void）：

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

    您可以指定一些必需参数，然后指定一组其他参数（比如一个字符串，一个数字，然后是一组额外的参数），因此：

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

    这对于像EventEmitter处理程序这样的东西很有用 .

    函数可以以这种方式强烈地输入，尽管如果你试图用类型别名来解决所有问题，你可能会被带走并遇到组合问题 .

    回复于
  • 187

    根据Ryan的回答，我认为您正在寻找的界面定义如下：

    interface Param {
    title: string;
    callback: () => void;
}
    回复于
  • 49

    这是一个接受回调的函数示例

    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的工作原理 .

    因此，在键入函数参数时不要忘记提供参数名称......看似愚蠢 .

    回复于
  • 26

    您可以通过各种方式在界面中定义函数类型，

    • 一般方式：
    export interface IParam {
  title: string;
  callback(arg1: number, arg2: number): number;
}
    • 如果您想使用属性语法，那么，
    export interface IParam {
  title: string;
  callback: (arg1: number, arg2: number) => number;
}
    • 如果先声明函数类型，
    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;
}
    • 您也可以声明一个函数类型文字，这意味着函数可以接受另一个函数作为它的参数 . 参数化函数也可以作为回调调用 .
    export interface IParam{
  title: string;
  callback(lateCallFn?:
             (arg1:number,arg2:number)=>number):number;

}
    回复于
  • -1
    interface Param {
   title: string;
   callback: () => {};
}
    回复于

相关问题