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) => x + y;
=
的前部分一样省略了,交由ts自动推导;而后,就是一个实际的匿名函数写法了。
以上就是TypeScript 获取函数的参数类型、返回值类型及定义返回函数类型的详细内容,更多关于TypeScript 获取函数的参数类型、返回值类型及定义返回函数类型的资料请关注脚本之家其它相关文章!
相关文章
深入探讨JavaScript、JQuery屏蔽网页鼠标右键菜单及禁止选择复制
这篇文章主要介绍了深入探讨JavaScript、JQuery屏蔽网页鼠标右键菜单及禁止选择复制,需要的朋友可以参考下2014-06-06深入理解JavaScript中的尾调用(Tail Call)
尾调用(Tail Call)是函数式编程的一个重要概念,下面这篇文章主要给大家深入的介绍了关于JavaScript中尾调用的相关资料,文中介绍的非常详细,相信对大家具有一定的参考价值,有需要的朋友们下面来一起看看吧。2017-02-02微信小程序调用腾讯地图API文档JavaScript SDK和WebService API详细解读
本文介绍了如何使用腾讯位置服务,包括申请开发者密钥、获取小程序APPID、下载地图SDK、设置服务器域名白名单等步骤,详细说明了如何在微信小程序中集成腾讯位置服务,进行地图展示和周边搜索等功能的实现,同时提醒注意API的调用次数和权限限制,需要的朋友可以参考下2024-09-09
最新评论