type-challenge刷題(easy部分)示例詳解

更新時間：2023年08月18日 11:10:48 作者：goblin_pitcher

這篇文章主要為大家介紹了type-challenge刷題(easy部分)示例詳解,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進步,早日升職加薪

type-challenge刷題

內(nèi)容接前文深入學習typescript type類型

type-challenge挑戰(zhàn)地址

easy

type MyPick<T, K extends keyof T> = {[k in K]: T[k]};
type MyReadonly<T> = {readonly [k in keyof T]: T[k]};
type TupleToObject<T extends readonly (string|number|symbol)[]> = {[k in T[number]]: k};
type First<T extends any[]> = T extends [infer Head, ...unknown[]] ? Head : never;
type Length<T extends readonly unknown[]> = T["length"]; // 題目要求readonly數(shù)組
type If<C extends boolean, T, F> = C extends true ? T : F;
type Concat<T extends unknown[], U extends unknown[]> = [...T, ...U];
type Push<T extends unknown[], U> = [...T, U];
type Unshift<T extends unknown[], U> = [U, ...T];
type MyParameters<T extends (...args: any[]) => any> = T extends (...args: infer U) => any ? U : never;

Exclude

原題地址

type MyExclude<T, U> = T extends U ? never : T;

這里有個遺漏的知識點...分配條件類型

當type參數(shù)聯(lián)合類型時，內(nèi)部其實是作循環(huán)處理的。以Exclude為例，分配條件類型的實際處理如下

MyExclude<'a'|'b'|'c', 'a'|'b'> = 
  ('a' extends 'a'|'b' ? never : 'a') |
  ('b' extends 'a'|'b' ? never : 'b') |
  ('c' extends 'a'|'b' ? never : 'c')

Await

原題地址

type PromiseLike<T = unknown> = {then: (cb: (arg: T)=>unknown) => unknown};
type MyAwaited<T extends PromiseLike> = T extends PromiseLike<infer U> ? (U extends PromiseLike ? MyAwaited<U> : U) : never;

需要實現(xiàn)await，即const result = await PromiseVal的await。

此處實現(xiàn)方式類似Promise A+協(xié)議中的resolvePromise部分，之所以以自定義的PromiseLike作為Promise的判斷條件，是因為在resolvePromise中，判斷一個對象是否是Promise，是以typeof promise.then === "function"作為判斷條件，這保證了不同pollyfill實現(xiàn)的Promise函數(shù)之間可以相互進行鏈式調(diào)用，且滿足PromiseLike的對象都能用async...await語法。

Include

原題地址

type Eq<X, Y> =
  (<T>() => T extends X ? 1 : 2) extends
  (<T>() => T extends Y ? 1 : 2) ? true : false
type Includes<T extends readonly any[], U> =
  T extends [infer H, ...infer Rest]
  ? (Eq<H, U> extends false ? Includes<Rest, U>: true)
  : false;

Include主體部分還好，最麻煩的是Equal部分，一開始寫的Equal如下

type Eq<X, Y> = X extends Y ? (Y extends X ? true : false) : false;
// 這個是錯的，測試用例如下
type check = Eq<boolean, true> // boolean

這里忽略了boolean其實是個復(fù)合類型，根據(jù)前面分配條件類型提到的，作為參數(shù)傳遞時會進行遍歷

type check = Eq<boolean, true> // boolean
// ??
// boolean -> true|false
// ====> Eq<true, true>|Eq<false, true> -> true|false -> boolean

直接翻看了'@type-challenges/utils'的庫，發(fā)現(xiàn)它是利用function的定義繞過對象的extends判斷。。這一點比較具有啟發(fā)性

type Eq<X, Y> =
    // 這里沒有直接進行X和Y的比較，那樣會觸發(fā)分配條件類型
    // 因此借助范型的變量T作為橋梁進行比較
  (<T>() => T extends X ? 1 : 2) extends
  (<T>() => T extends Y ? 1 : 2) ? true : false

習慣了常規(guī)編程語言的語法后，很容易忽略【分配條件類型】這條規(guī)則，可以借用中間變量的思想，間接繞過直接的extends判定

以上就是type-challenge刷題(easy部分)示例詳解的詳細內(nèi)容，更多關(guān)于type-challenge刷題的資料請關(guān)注腳本之家其它相關(guān)文章！

您可能感興趣的文章: