前言

在 TypeScript 中，當(dāng)需要一個(gè)長(zhǎng)度固定的數(shù)組時(shí)，通常會(huì)想到使用元組來(lái)進(jìn)行表示，不過(guò)相對(duì)于數(shù)組而言，元組的每個(gè)元素的類(lèi)型都不必是一致的。

如果現(xiàn)在需要一個(gè)長(zhǎng)度為 30，元素類(lèi)型為 string 的數(shù)組類(lèi)型，其實(shí)就是一個(gè)元組，如果直接手寫(xiě)出來(lái)，那也太麻煩了，本文因此有感而發(fā)，編寫(xiě)了自動(dòng)創(chuàng)建的類(lèi)型工具。

代碼

首先，不管三七二十一，先把這個(gè)類(lèi)型工具給定義出來(lái)：

type FixedArray = any

然后開(kāi)始逐步分析，先從泛型下手：

• 因?yàn)殚L(zhǎng)度是可以指定了，所以必定接受一個(gè)泛型 Len 用于表示數(shù)組長(zhǎng)度；
• 而且因?yàn)槭菙?shù)組，必須得要指定數(shù)組的類(lèi)型，所以還有一個(gè)數(shù)組類(lèi)型的泛型 T；
• 因?yàn)?TypeScript 中的遍歷生成，一般都是使用遞歸實(shí)現(xiàn)的，所以還得有第三個(gè)參數(shù)，用于接受上一次執(zhí)行后得到的數(shù)組 List。

綜上，這個(gè)類(lèi)型工具加上泛型之后，如下：

type FixedArray<T = any, Len extends number = 6, List extends Array<T> = []> = any

接下去的步驟就很簡(jiǎn)單了，判斷 List 的長(zhǎng)度是否等于 Len，是的話(huà)，就直接返回 List，不是的話(huà)，將 List 和一個(gè)新的元素組成新的數(shù)組，把這個(gè)數(shù)組作為泛型，傳入遞歸調(diào)用的 FixedArray 即可。

判斷 List 的長(zhǎng)度是否等于 Len

思路很簡(jiǎn)單，關(guān)鍵點(diǎn)在于如何判斷 List 的長(zhǎng)度是否等于 Len？

根據(jù)上面的定義，Len 是 number 類(lèi)型的字面量，對(duì)于字面量而言，若是使用 extends 判斷其子類(lèi)型，只有 never 和其本身能夠滿(mǎn)足，所以只要排除掉 Len 是 never 的情況，剩下的只要判斷 List['length'] 是否 extends Len 即可。

還有一點(diǎn)，因?yàn)?Len 是 extends number 的，所以傳入 number 也是合法的，但是會(huì)造成死循環(huán)，所以也需要排除掉 Len 是 number 本身的情況，綜上，判斷 Len 是否是合法的 number 字面量的類(lèi)型工具如下，比較簡(jiǎn)單，不在贅述：

//判斷是否為 never 的類(lèi)型工具
type IsNever<T> = [T] extends [never] ? true : false
// 用于判斷兩個(gè)泛型是否相同，只要一個(gè)泛型傳入 Len, 零一個(gè)泛型傳入 number，就能判斷 Len 是否為 number 本身
type IsTypeSelf<TA, TB> = TA extends TB ? TB extends TA ? true : false : false
// 判斷 Len 是否為合法的 number 字面量類(lèi)型
type IslegalNumber<N> = IsNever<N> extends true ? false : IsTypeSelf<number, N> extends true ? false : true

那么在 FixedArray 中，先判斷 Len 是否合法，不合法直接返回 List:

type FixedArray<T = any, Len extends number = 6, List extends Array<T> = []> =
    IslegalNumber<Len> extends false // 判斷 Len 是否合法
    ? List
    : any

然后再判斷 List['length'] 是否 extends Len 即可，如果是，返回 List，如果不是，將 List 和一個(gè)新的元素組成新的數(shù)組，把這個(gè)數(shù)組作為泛型，傳入遞歸調(diào)用的 FixedArray：

type FixedArray<T = any, Len extends number = 6, List extends Array<T> = []> =
    IslegalNumber<Len> extends false
    ? List
    : List['length'] extends Len // 判斷 `List['length']` 是否等于 `Len`
    ? List // 是就返回 List 本身
    : FixedArray<T, Len, [...List, T]> // 不是就遞歸，注意傳入的數(shù)組添加了新的元素 T

測(cè)試一下：

type FixedArrayInstance = FixedArray<string, 30>

可以看到，生成了一個(gè)長(zhǎng)度為30，元組類(lèi)型都為 string 的元組。

以上就是TypeScript編寫(xiě)自動(dòng)創(chuàng)建長(zhǎng)度固定數(shù)組的類(lèi)型工具詳解的詳細(xì)內(nèi)容，更多關(guān)于TypeScript自動(dòng)創(chuàng)建長(zhǎng)度固定數(shù)組的資料請(qǐng)關(guān)注腳本之家其它相關(guān)文章！

最新評(píng)論