TypeScript?獲取函數(shù)的參數(shù)類(lèi)型、返回值類(lèi)型及定義返回函數(shù)類(lèi)型
事例:
function test(lzwme: string, idx: number) {
return {
lzwme,
idx,
};
}1 獲取函數(shù)的參數(shù)類(lèi)型
使用預(yù)定義的 Parameters 可以獲取到一個(gè)函數(shù)的參數(shù)類(lèi)型列表。
獲取 test 函數(shù)的參數(shù)類(lèi)型:
type TestArgsType = Parameters<typeof test>; // TestArgsType => [lzwme: string, idx: number]
獲取 idx 參數(shù)的類(lèi)型:
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;
我們可以看到,其實(shí)它主要是通過(guò) infer P 獲取到 T 的參數(shù)類(lèi)型列表 P 并返回,如果 T 不是函數(shù)則返回 never。
2 獲取函數(shù)的返回值類(lèi)型
使用預(yù)定義的 ReturnType 可以獲取到一個(gè)函數(shù)的參數(shù)類(lèi)型列表。
獲取 test 函數(shù)的返回值類(lèi)型:
type TestReturnType = ReturnType<typeof test>;
我們?cè)倏匆幌?nbsp;ReturnType 的定義:
type ReturnType<T extends (...args: any) => any> = T extends (...args: any) => infer R ? R : any;
與 Parameters 十分類(lèi)似,不同的是通過(guò) infer R 獲取并返回 T 的返回值類(lèi)型。
TypeScript定義返回函數(shù)類(lèi)型
一般函數(shù)聲明:
//第一種形式
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();
//第三種形式,箭頭函數(shù)
let d: (para: string) => string;
d = function(param: string): string {
return param;
}
//第四種形式,類(lèi)型別名,箭頭函數(shù)
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;
}
箭頭函數(shù):
其實(shí)這里只是涉及一個(gè)簡(jiǎn)單的聲明定義而已。
正如:
let myAdd: (x:number, y:number) => number =
function(x: number, y: number): number { return x + y; };只是一個(gè)函數(shù)類(lèi)型聲明(或匿名函數(shù)),如果我們用一個(gè)簡(jiǎn)單的變量聲明定義,那其完整格式如下:
let x: number = 10;
其上的 number 部分相當(dāng)于開(kāi)頭的 (x:number, y:number) => number,這一部分即是類(lèi)型(或函數(shù)類(lèi)型),只是一種定義;哪怕你使用:
let myAdd: (aaaaaaaaaaaaaaaaaaaaaa:number, bbbbbbbbbbbbbbbbbbbbbbbb:number) => number =
function(x: number, y: number): number { return x + y; };也是可以的。
同樣,一個(gè)變量的聲明定義也可以是這樣:
let x = 10;
這一點(diǎn)自然是歸咎于TS自動(dòng)推導(dǎo)能力了。因此,如上也可以簡(jiǎn)化成:
const myAdd = (x: number, y: number) => x + y;
= 的前部分一樣省略了,交由ts自動(dòng)推導(dǎo);而后,就是一個(gè)實(shí)際的匿名函數(shù)寫(xiě)法了。
以上就是TypeScript 獲取函數(shù)的參數(shù)類(lèi)型、返回值類(lèi)型及定義返回函數(shù)類(lèi)型的詳細(xì)內(nèi)容,更多關(guān)于TypeScript 獲取函數(shù)的參數(shù)類(lèi)型、返回值類(lèi)型及定義返回函數(shù)類(lèi)型的資料請(qǐng)關(guān)注腳本之家其它相關(guān)文章!
- typescript返回值類(lèi)型和參數(shù)類(lèi)型的具體使用
- Typescript中函數(shù)類(lèi)型及示例詳解
- typescript類(lèi)型體操及關(guān)鍵字使用示例詳解
- TypeScript中類(lèi)型映射的使用
- TypeScript中d.ts類(lèi)型聲明文件的實(shí)現(xiàn)
- TypeScript中的類(lèi)型運(yùn)算符實(shí)現(xiàn)
- TypeScript基本類(lèi)型 typeof 和keyof案例詳解
- 淺聊一下TypeScript中的4種類(lèi)型守衛(wèi)
- typescript?type類(lèi)型使用梳理總結(jié)
相關(guān)文章
解決layui-open關(guān)閉自身窗口的問(wèn)題
今天小編就為大家分享一篇解決layui-open關(guān)閉自身窗口的問(wèn)題,具有好的參考價(jià)值,希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧2019-09-09
bootstrap Table實(shí)現(xiàn)合并相同行
這篇文章主要為大家詳細(xì)介紹了bootstrapTable實(shí)現(xiàn)合并相同行,fastadmin框架同樣使用,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2019-07-07
淺談redux, koa, express 中間件實(shí)現(xiàn)對(duì)比解析
這篇文章主要介紹了淺談redux, koa, express 中間件實(shí)現(xiàn)對(duì)比解析,文中通過(guò)示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2019-05-05
如何創(chuàng)建一個(gè)JavaScript彈出DIV窗口層的效果
我將用最通俗的語(yǔ)言和最簡(jiǎn)潔的代碼給大家演示如何創(chuàng)建一個(gè)JavaScript彈出DIV窗口層的效果2013-09-09
詳解javascript中對(duì)數(shù)據(jù)格式化的思考
本篇文章主要介紹了詳解javascript中對(duì)數(shù)據(jù)文本格式化的思考 ,具有一定的參考價(jià)值,有興趣的可以了解一下。2017-01-01
javascript跨域總結(jié)之window.name實(shí)現(xiàn)的跨域數(shù)據(jù)傳輸
本文給大家介紹window.name實(shí)現(xiàn)的跨域數(shù)據(jù)傳輸,自己親自實(shí)踐了一下,真的非常好用,特此分享到腳本之家網(wǎng)站供大家參考2015-11-11
返回頁(yè)面頂部top按鈕通過(guò)錨點(diǎn)實(shí)現(xiàn)(自寫(xiě))
用戶在使用系統(tǒng)時(shí),會(huì)有很多表單的操作然而很多表單就會(huì)很長(zhǎng),所以就需要一個(gè)返回頁(yè)面頂部的top按鈕啦,于是自己寫(xiě)了一個(gè),喜歡的朋友可以參考下2013-08-08
基于JavaScript實(shí)現(xiàn)瀑布流效果(循環(huán)漸近)
本文給大家介紹基于javascript實(shí)現(xiàn)循環(huán)漸近瀑布流效果,代碼簡(jiǎn)單易懂,非常具有參考價(jià)值,需要的朋友參考下吧2016-01-01

