電子商務(wù)網(wǎng)站建設(shè)實用教程教案黃頁88推廣多少錢一年
typescript Awaited教程用法
文章目錄
- typescript Awaited<Type>教程用法
ts4.5發(fā)布了Awaited,但是很多人不明白Awaited的用法。
首先看一下官方的說明:這種類型旨在模擬函數(shù)await中的操作async,或 s.then()上的方法——特別是它們遞歸解包Promise的方式。
首先看一個例子:
async function test() {let aa = Promise.resolve(Promise.resolve(Promise.resolve('hello world')))let bb = await aa;
}
test();
這里我們可以正確得到bb類型為string
。
在js中和ts中,await和.then()都能遞歸得到一個非Promise的。Awaited就是模仿這種行為,遞歸解包獲取其中的類型。不理解沒事,繼續(xù)往下看:
let aa = Promise.resolve(Promise.resolve(Promise.resolve('hello world')))
還是這段代碼
我們想設(shè)置一個別名 cc 的類型為 aa 的Promise異步操作返回值的類型
該怎么做?
或許有人認(rèn)為,直接設(shè)置 string
類型不就好了:
let aa = Promise.resolve(Promise.resolve(Promise.resolve('hello world')))
type cc = string;
但這樣真的好嗎,很多請求或者異步操作返回值可能都是不固定,當(dāng)然,除非你定死它返回的必須是string類型。如果這樣或許你真的不需要Awaited了。
進(jìn)行下面內(nèi)容開始之前,你腦海中需要有一個印象:
let aa = Promise.resolve(Promise.resolve(Promise.resolve('hello world')))
type cc = typeof aa
其中cc的類型為 Promise<string>
,這很重要。=所以,看到這里,我們要做的就是取出Promise中的string(也可能是其他,總之是尖括號里的內(nèi)容)。=
推薦你每一步都手動操作一下,地址:typescript在線運(yùn)行
接下來使用另一種方法:
let aa = Promise.resolve(Promise.resolve(Promise.resolve('hello world')))
type cc = typeof aa extends Promise<infer U> ? U : typeof aa;
在 Awaited 還沒出來之前,一般使用這種方法獲取異步操作返回值的類型。首先判斷 typeof aa
是否為 Promise
,如果是則取出其中的類型,如果不是,則直接返回typeof aa
。
肉眼可見,確實不方便:
接下來使用 Awaited:
let aa = Promise.resolve(Promise.resolve(Promise.resolve('hello world')))
type cc = Awaited<typeof aa>
是不是很簡潔。
如果你用過infer,到這里基本上就理解了。
為什么這里使用 typeof aa
:
- 這里的aa其實是一個值,而type需要一個類型,所以我們需要一個關(guān)鍵字typeof獲取aa的類型。
既然typeof aa
就表示類型,為什么還要Awaited<>:
- 上文說了,typeof aa 會返回
Promise<string>
,而這篇文章主要講的內(nèi)容就是獲取異步操作返回值的類型。
看一個例子:
type aa = Promise<Promise<Promise<string>>>
type cc = Awaited<aa>
如果 aa 是類型,則我們可以直接使用 Awaited<aa>
,我們cc的類型為string
類型。