TS体操类型学习记录
Easy
1. Easy - 4 - Pick
从类型 T
中选出符合 K
的属性,构造一个新的类型
type MyPick<T, K extends keyof T> = {
[key in K]: T[key]
}
keyof
是 TypeScript 中的一个关键字,用于获取一个类型的所有属性名组成的联合类型。extends
可以用于约束泛型类型参数、定义类型继承关系和条件类型的判断。- 在映射类型中,可以通过
in
关键字遍历联合类型,可以用于遍历一个类型的属性名(需要通过keyof
获取属性名组成的联合类型),并对每个属性进行相应的操作。
2. Easy - 7 - Readonly
泛型 Readonly<T>
会接收一个泛型参数,并返回一个完全一样的类型,只是所有属性都会是只读 (readonly) 的。
type MyReadonly<T> = {
readonly [key in keyof T]: T[key];
}
- 在 TypeScript 中,可以使用 readonly 修饰符来指定一个只读属性。
3. Easy - 11 - Tuple to Object
将一个元组类型转换为对象类型,这个对象类型的键/值和元组中的元素对应。
type TupleToObject<T extends readonly (string | number | symbol)[]> = {
[key in T[number]]: key
}
- 元组类型是 TypeScript 中的一种特殊数据类型,它允许我们定义一个固定长度和固定类型顺序的数组。
- 通过
T[number]
可以获取元组T
所有成员组成的联合类型。 - 加readonly 的作用,因为测试用例定义的变量都是
const
,const
的作如下:
const tupleNumber = [1, 2, '33'] // (string | number)[]
const tupleNumber = [1, 2, '33'] as const // readonly [1, 2, "33"]
4. Easy - 14 - First of Array
实现一个 First<T>
泛型,它接受一个数组 T
并返回它的第一个元素的类型。
// 解法一:判断数组长度是否为0
type First<T extends any[]> = T['length'] extends 0 ? never : T[0]
// 解法二:判断是否为空数组
type First<T extends any[]> = T extends [] ? never : T[0]
// 解法三:获取T所有元素类型组成的联合类型,如果为never证明为空数组
type First<T extends any[]> = T[number] extends never ? never : T[0];
// 解法四:我们可以通过 keyof T 来获取类型 T 所有键的类型组合,那么如果 '0' 是 T 的键就表示 T 是一个非空数组
type First<T extends any[]> = '0' extends keyof T ? T[0] : never;
// 解法五:infer进行模式匹配
type First<T extends any[]> = T extends [infer A, ...infer _rest] ? A : never
- 在 TS 中
A extends B ? C : D
的意思是“如果A
可以赋值给B
,那么类型就是C
,否则就是D
”。 - T[0] 获取数组
T
下标为 0 的元素类型 - 在 TS 中,我们通过 extends 和 infer 可以实现一个类似于模式匹配的效果,
- 其中 ...infer _rest 是我们对元组类型使用的扩展运算,在这里用于表示剩余元素。
5. Easy - 18 - Length of Tuple
创建一个Length泛型,这个泛型接受一个只读的元组,返回这个元组的长度。
type Length<T extends readonly unknown[]> = T['length']
- 注意必须是
const
的类型,否则长度类型为number
6. Easy - 43 - Exclude
从联合类型 T 中排除 U 中的类型,来构造一个新的类型。
type MyExclude<T, U> = T extends U ? never : T;
- 当
T extends U ? ...
中的T
为联合类型时,会把联合类型中的每一个类型单独进行判断,然后再把结果组合成一个联合类型返回。 - 如果你想避免这种行为,那么使用 [] 包裹你的类型参数即可,注意在 extends 关键字的两侧都需要:
[T] extends [U] ? ...
7. Easy - 189 - Awaited
假如我们有一个 Promise
对象,这个 Promise
对象会返回一个类型。在 TS 中,我们用 Promise
中的 T
来描述这个 Promise
返回的类型。请你实现一个类型,可以获取这个类型。
interface Thenable<T> {
then: (onfulfilled: (arg: T) => any) => any
}
type MyAwaited<T extends Promise<any> | Thenable<any>> = T extends Promise<infer A> | Thenable<infer A>
? A extends Promise<infer _X> ? MyAwaited<A> : A
: never
8. Easy - 268 - IF
实现一个 IF
类型,它接收一个条件类型 C
,一个判断为真时的返回类型 T
,以及一个判断为假时的返回类型 F
。 C
只能是 true
或者 false
, T
和 F
可以是任意类型。
type If<C extends boolean, T, F> = C extends true ? T : F;
9. Easy - 533 - Concat
在类型系统里实现 JavaScript 内置的 Array.concat
方法,这个类型接受两个参数,返回的新数组类型应该按照输入参数从左到右的顺序合并为一个新的数组。
type Concat<T extends any[], U extends any[]> = [...T, ...U]
- 在 TS 中,扩展语法可以对元组类型使用,用法类似于在 JS 中对值的使用
10. Easy - 898 - Includes ※
在类型系统里实现 JavaScript 的 Array.includes
方法,这个类型接受两个参数,返回的类型要么是 true
要么是 false
。
type Equal<X, Y> = (<T>() => T extends X ? 1 : 2) extends <T>() => T extends Y ? 1 : 2
? true
: false;
type Includes<T extends readonly unknown[], U> =
T extends [infer F, ...infer Rest]
? Equal<F, U> extends true ? true : Includes<Rest, U>
: false;
- Equal 实现原理很复杂,暂时搞不懂,记住得了
11. Easy - 3057 - Push
type Push<T extends unknown[], U> = [...T, U]
12. Easy - 3060 - Unshift
type Unshift<T extends unknown[], U> = [U, ...T]
13. Easy - 3312 - Parameters
实现内置的 Parameters 类型
type MyParameters<T extends (...args: any[]) => any> = T extends (...args: infer P) => any ? P : never;
- 使用
infer
表示待推断的类型变量,由于...args
本身已经是元组类型,因此infer P
最终推导出的,也是元组类型。
Medium
1. Medium - 2 - Get Return Type
type MyReturnType<T> = T extends (...args: any) => infer R ? R : never
2. Medium - 3 - Omit *
解法一,去遍历 T 中除了 K 的键。
type MyExclude<T, P> = T extends P ? never : T;
type MyOmit<T, K extends keyof T> = {
[P in MyExclude<keyof T, K>]: T[key]
}
解法二,利用 Pick 实现,获取 T 中除了 K 的键
type MyOmit<T, K extends keyof T> = Pick<T, Exclude<keyof T, K>>
解法三,直接实现
这样不对,因为不应该存在的键也会存在,只不过类型为never。
type MyOmit<T, K extends keyof T> = {
[P in keyof T]: P extends K ? never : T[key]
}
要将对应的键设置为never
type MyOmit<T, K extends keyof T> = {
[P in keyof T as P extends K ? never : P]: T[P];
};
3. Medium - 3 - Readonly 2
MyReadonly2<T, K>
在 T
把 K
包含的属性置为 readonly
其余不变,不传 K
就把所有的属性变成 readonly
,此时同 Readonly
。
重点是 K
可以不传,所以要赋默认值。
type MyReadonly2<T, K extends keyof T = keyof T> = Readonly<Pick<T, K>> & Omit<T, K>