TypeScript 获取函数的参数类型、返回值类型及定义返回函数类型

 更新时间:2024年02月15日 08:57:55   作者:ZHWenDong  
这篇文章主要介绍了TypeScript 获取函数的参数类型、返回值类型及定义返回函数类型,需要的朋友可以参考下

事例:

function test(lzwme: string, idx: number) {
  return {
    lzwme,
    idx,
  };
}

1 获取函数的参数类型

使用预定义的 Parameters 可以获取到一个函数的参数类型列表。
获取 test 函数的参数类型:

type TestArgsType = Parameters<typeof test>;
// TestArgsType => [lzwme: string, idx: number]

获取 idx 参数的类型:

type TestArgsType = Parameters<typeof test>[1];
// TestArgsType => idx: number

我们看一下 Parameters 的定义:

type Parameters<T extends (...args: any) => any> = T extends (...args: infer P) => any ? P : never;

我们可以看到,其实它主要是通过 infer P 获取到 T 的参数类型列表 P 并返回,如果 T 不是函数则返回 never

2 获取函数的返回值类型

使用预定义的 ReturnType 可以获取到一个函数的参数类型列表。

获取 test 函数的返回值类型:

type TestReturnType = ReturnType<typeof test>;

我们再看一下 ReturnType 的定义:

type ReturnType<T extends (...args: any) => any> = T extends (...args: any) => infer R ? R : any;

与 Parameters 十分类似,不同的是通过 infer R 获取并返回 T 的返回值类型。

TypeScript定义返回函数类型

一般函数声明:

//第一种形式
let c: Function;
c = function(): void {
console.log('It work');
}

//第二种形式
function test(): Function{
return function():void{
console.log('it work');
}
}

let a:Function = test();
a();

//第三种形式,箭头函数
let d: (para: string) => string;
d = function(param: string): string {
return param;
}

//第四种形式,类型别名,箭头函数
type e = (para: string) => string;
const f:e = function(pass: string): string{

return pass;

}

//第五种形式,接口
interface g{
(para: string): string;
}
const h: g = function(pass: string): string{
return pass;
}

箭头函数:

其实这里只是涉及一个简单的声明定义而已。

正如:

let myAdd: (x:number, y:number) => number =
function(x: number, y: number): number { return x + y; };

只是一个函数类型声明(或匿名函数),如果我们用一个简单的变量声明定义,那其完整格式如下:

let x: number = 10;

其上的 number 部分相当于开头的 (x:number, y:number) => number,这一部分即是类型(或函数类型),只是一种定义;哪怕你使用:

let myAdd: (aaaaaaaaaaaaaaaaaaaaaa:number, bbbbbbbbbbbbbbbbbbbbbbbb:number) => number =
function(x: number, y: number): number { return x + y; };

也是可以的。

同样,一个变量的声明定义也可以是这样:

let x = 10;

这一点自然是归咎于TS自动推导能力了。因此,如上也可以简化成:

const myAdd = (x: number, y: number) =&gt; x + y;

= 的前部分一样省略了,交由ts自动推导;而后,就是一个实际的匿名函数写法了。

以上就是TypeScript 获取函数的参数类型、返回值类型及定义返回函数类型的详细内容,更多关于TypeScript 获取函数的参数类型、返回值类型及定义返回函数类型的资料请关注脚本之家其它相关文章!

相关文章

最新评论