日韩无码专区无码一级三级片|91人人爱网站中日韩无码电影|厨房大战丰满熟妇|AV高清无码在线免费观看|另类AV日韩少妇熟女|中文日本大黄一级黄色片|色情在线视频免费|亚洲成人特黄a片|黄片wwwav色图欧美|欧亚乱色一区二区三区

type T0 = string[];
type T1 = () => string;

要實(shí)現(xiàn)上述的功能，我們可以使用 TypeScript 提供的類(lèi)型模式匹配技術(shù) —— 條件類(lèi)型 + infer。條件類(lèi)型允許我們檢測(cè)兩種類(lèi)型之間的關(guān)系，通過(guò)條件類(lèi)型我們就可以判斷兩種類(lèi)型是否相兼容。而 infer 用于聲明類(lèi)型變量，以存儲(chǔ)在模式匹配過(guò)程中所捕獲的類(lèi)型。

創(chuàng)新互聯(lián)建站主要從事做網(wǎng)站、網(wǎng)站設(shè)計(jì)、網(wǎng)頁(yè)設(shè)計(jì)、企業(yè)做網(wǎng)站、公司建網(wǎng)站等業(yè)務(wù)。立足成都服務(wù)上栗,十余年網(wǎng)站建設(shè)經(jīng)驗(yàn),價(jià)格優(yōu)惠、服務(wù)專(zhuān)業(yè),歡迎來(lái)電咨詢建站服務(wù):18982081108

下面我們來(lái)看一下如何捕獲 T0 數(shù)組類(lèi)型中元素的類(lèi)型：

type UnpackedArray = T extends (infer U)[] ? U : T
type U0 = UnpackedArray // string

在以上代碼中，T extends (infer U)[] ? U : T 是條件類(lèi)型的語(yǔ)法，而 extends 子句中的 infer U 引入了一個(gè)新的類(lèi)型變量 U，用于存儲(chǔ)被推斷的類(lèi)型。

為了便于大家的理解，我們來(lái)演示一下 UnpackedArray 工具類(lèi)型的執(zhí)行流程。

type U0 = UnpackedArray

// T => T0: string[]
type UnpackedArray = string[] extends (infer U)[] ? U : string[] 
// string[] extends (infer U)[] 模式匹配成功
// U => string 

需要注意的是，infer 只能在條件類(lèi)型的 extends 子句中使用，同時(shí) infer 聲明的類(lèi)型變量只在條件類(lèi)型的 true 分支中可用。

type Wrong1 = T[0] // Error
type Wrong2 = (infer U)[] extends T ? U : T // Error
type Wrong3 = T extends (infer U)[] ? T : U // Error

了解完這些知識(shí)之后，我們來(lái)看一下如何獲取 T1 函數(shù)類(lèi)型的返回值類(lèi)型：

type UnpackedFn = T extends (...args: any[]) => infer U ? U : T;

type U1 = UnpackedFn; // string

看完 UnpackedFn 工具類(lèi)型的實(shí)現(xiàn)，是不是覺(jué)得挺簡(jiǎn)單的。當(dāng)遇到函數(shù)重載的場(chǎng)景，TypeScript 將使用最后一個(gè)調(diào)用簽名進(jìn)行類(lèi)型推斷：

declare function foo(x: string): number;
declare function foo(x: number): string;
declare function foo(x: string | number): string | number;

type UnpackedFn = T extends (...args: any[]) => infer U ? U : T;
type U2 = UnpackedFn;  // string | number

如果你對(duì) TypeScript 的條件類(lèi)型還不了解的話，建議觀看 “用了 TS 條件類(lèi)型，同事直呼 YYDS” 這篇文章。在該篇文章中，我們介紹了條件鏈，利用條件鏈我們可以實(shí)現(xiàn)功能更加強(qiáng)大的 Unpacked 工具類(lèi)型。

type Unpacked =
    T extends (infer U)[] ? U :
    T extends (...args: any[]) => infer U ? U :
    T extends Promise ? U :
    T;

type T0 = Unpacked;  // string
type T1 = Unpacked;  // string
type T2 = Unpacked<() => string>;  // string
type T3 = Unpacked>;  // string
type T4 = Unpacked[]>;  // Promise
type T5 = Unpacked[]>>;  // string

在以上代碼中，Unpacked 工具類(lèi)型利用了條件類(lèi)型和條件鏈，輕松實(shí)現(xiàn)了推斷出數(shù)組類(lèi)型中元素的類(lèi)型、函數(shù)類(lèi)型返回值的類(lèi)型和 Promise 類(lèi)型中返回值的類(lèi)型的功能。

其實(shí)，利用條件類(lèi)型和 infer，我們還可以推斷出對(duì)象類(lèi)型中鍵的類(lèi)型。接下來(lái)，我們來(lái)舉個(gè)具體的例子：

type User = {
  id: number;
  name: string;
}

type PropertyType =  T extends { id: infer U, name: infer R } ? [U, R] : T
type U3 = PropertyType // [number, string]

在 PropertyType 工具類(lèi)型中，我們通過(guò) infer 聲明了兩個(gè)類(lèi)型變量 U 和 R，分別表示對(duì)象類(lèi)型中 id 和 name 屬性的類(lèi)型。若類(lèi)型匹配，我們就會(huì)以元組的形式返回 id 和 name 屬性的類(lèi)型。

那么現(xiàn)在問(wèn)題來(lái)了，在 PropertyType 工具類(lèi)型中，如果只聲明一個(gè)類(lèi)型變量 U，那結(jié)果又會(huì)是怎樣呢?下面我們來(lái)驗(yàn)證一下：

type PropertyType =  T extends { id: infer U, name: infer U } ? U : T

type U4 = PropertyType // string | number

由以上代碼可知，U4 類(lèi)型返回的是 string 和 number 類(lèi)型組合成的聯(lián)合類(lèi)型。為什么會(huì)返回這樣的結(jié)果呢?這是因?yàn)樵趨f(xié)變位置上，若同一個(gè)類(lèi)型變量存在多個(gè)候選者，則最終的類(lèi)型將被推斷為聯(lián)合類(lèi)型。

然而，在逆變位置上，若同一個(gè)類(lèi)型變量存在多個(gè)候選者，則最終的類(lèi)型將被推斷為交叉類(lèi)型。同樣，我們來(lái)實(shí)際驗(yàn)證一下：

type Bar = T extends { a: (x: infer U) => void, b: (x: infer U) => void } ? U : never;

type U5 = Bar<{ a: (x: string) => void, b: (x: number) => void }>;  // string & number

在以上代碼中，U5 類(lèi)型返回的是 string 和 number 類(lèi)型組合成的交叉類(lèi)型，即最終的類(lèi)型是 never 類(lèi)型。

看完本文之后，相信你已經(jīng)了解條件類(lèi)型和 infer 的作用了。那么你能看懂 UnionToIntersection 這個(gè)工具類(lèi)型的具體實(shí)現(xiàn)么?

type UnionToIntersection = (
  U extends any ? (arg: U) => void : never
) extends (arg: infer R) => void
  ? R
  : never