type-challenges: easy-awaited | infer 应该如何使用

type-challenges/README.md at main · TIMPICKLE/type-challenges · GitHub

 infer的理解: 二元一次方程的 x,是一个未知的变量。 

类比到TS, infer x 是指一个未知的类型。

If we have a type which is wrapped type like Promise. How we can get a type which is inside the wrapped type?

For example: if we have Promise how to get ExampleType?

type ExampleType = Promise

type Result = MyAwaited // string

理解一下题目意思,你得解析出来promise的T的类型是什么,如果是联合类型,也需要解析出。

开始敲代码

测试用例:

import type { Equal, Expect } from '@type-challenges/utils'

type X = Promise
type Y = Promise<{ field: number }>
type Z = Promise>
type Z1 = Promise>>
type T = { then: (onfulfilled: (arg: number) => any) => any }

type cases = [
  Expect, string>>,
  Expect, { field: number }>>,
  Expect, string | number>>,
  Expect, string | boolean>>,
  Expect, number>>,
]

首先:

1. extens限制类型

type MyAwait = T extends Promise<>;

2. 然后使用infer X 来设置一个未知的类型

type MyAwait = T extends Promise;

3. 然后返回结果, 三元表达式

type MyAwait = T extends Promise ? X : never;

4. 现在解决 测试用例的第三个,嵌套的promise,使用递归

type Z1 = Promise>>
type MyAwait = T extends Promise ? MyAwait : never;

5 检查一下递归出口

type MyAwait = T extends Promise ? MyAwait : T;

6. 再处理一下非promise类型的参数

type MyAwait = T extends Promise 
                  ? X entends Promise
                  ? MyAwait
                  : X
                  : never ;

woc看到github提交记录里有个b是这么写的,压缩大师:

type MyAwaited = T extends PromiseLike ? MyAwaited: T

https://github.com/type-challenges/type-challenges/issues/21580

又涉及到的知识,关于TS的Like是什么东西:

javascript - Why does TypeScript use "Like" types? - Stack Overflow

interface PromiseLike {
    /**
     * Attaches callbacks for the resolution and/or rejection of the Promise.
     * @param onfulfilled The callback to execute when the Promise is resolved.
     * @param onrejected The callback to execute when the Promise is rejected.
     * @returns A Promise for the completion of which ever callback is executed.
     */
    then(
onfulfilled?: ((value: T) => TResult1 | PromiseLike) | undefined | null,
onrejected?: ((reason: any) => TResult2 | PromiseLike) | undefined | null): PromiseLike;
}

 

你可能感兴趣的:(JS,前端,javascript,开发语言)