【Typescript】type-challenges:easy级别题目(上)

144 阅读2分钟

1681442893877.png

1、实现Pick

题目内容

1681443011292.png

题目解析

涉及知识点: keyof 、 in 、 extends

这里不对知识点进行回顾,默认已经知晓。 需要注意的是:

  1. K 肯定是属于 T 的属性名中,所以 K extends keyof T
  2. 返回的对象的属性 P 属于 K 的分类中, P in K
题目答案
// ============= Your Code Here =============
type MyPick<T, K extends keyof T> = {
  [P in K]: T[P]
}

2、实现Readonly

题目内容

1681444385755.png

题目解析

涉及知识点: keyof 、 in 、 readonly

总体来说:

  1. 遍历 T 中的所有属性, K in keyof T
  2. 所有返回的对象属性都要加上 readonly
题目答案
// ============= Your Code Here =============
type MyReadonly<T> = {
  readonly [K in keyof T]: T[K]
}

3、实现 Tuple To Object

题目内容

1681444741670.png

例如:

const tuple = ['tesla', 'model 3', 'model X', 'model Y'] as const

type result = TupleToObject<typeof tuple> // expected { tesla: 'tesla', 'model 3': 'model 3', 'model X': 'model X', 'model Y': 'model Y'}
题目解析

涉及知识点: extends 、 in 、 Tuple

总体来说:

  1. 首先返回的一定是个对象
  2. 其次,本题的关键是通过数组的下标获取元组的元素类型
题目答案

初版答案:

// ============= Your Code Here =============
type TupleToObject<T extends readonly any[]> = {
  [P in T[number]]: P
}

但是,在错误类型这里还是报错了。

1681445845106.png

所以这里不能使用any[], 而应该对元组类型做约束,使用 PropertyKey[], 但PropertyKey是什么呢?

type PropertyKey = string | number | symbol

最终版答案

type PropertyKey = string | number | symbol
type TupleToObject<T extends readonly PropertyKey[]> = {
    [P in T[number]]: P
}

4、实现First Of Array

题目内容

1681446730130.png

题目解析

涉及知识点: infer 、 extends

这题很简单,我们只需要获取数组第一项就好,使用[infer First, ...infer Rest]。

不过我们还是需要判断是不是符合数组类型。

题目答案
// ============= Your Code Here =============
type First<T extends any[]> = T extends [infer First, ...infer Rest] ? First : never

5、实现Length of Tuple

题目内容

1681447080456.png

题目解析

涉及知识点: T['length'] 、 readonly

数组自带length属性,直接获取就行了,就是要表明是readonly

题目答案
// ============= Your Code Here =============
type Length<T extends readonly any[]> = T['length']

6、实现Exclude

题目内容

1681447461679.png

题目解析

涉及知识点: extends 、 联合类型

这题就是剔除不需要的属性,如果T extends U ,那就返回never,否则就返回T

题目答案
// ============= Your Code Here =============
type MyExclude<T, U> =  T extends U ? never : T