实现 Pick

Posted on In , , Views: Changyan: Word count in article: 154 Reading time ≈ 1 mins.
不使用 `Pick` ，实现 TS 内置的 `Pick` 的功能.

不使用 Pick<T, K> ，实现 TS 内置的 Pick<T, K> 的功能

从类型 T 中选出符合 K 的属性，构造一个新的类型。

例如：

1
2
3
4
5
6
7
8
9
10
11
12
13
interface Todo {
  title: string
  description: string
  completed: boolean
}

type TodoPreview = MyPick<Todo, 'title' | 'completed'>

const todo: TodoPreview = {
    title: 'Clean room',
    completed: false,
}

解答

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
interface Todo {
title: string;
description: string;
completed: boolean;
}
// 1. K extends keyof T, K继承所有的T的key属性为type
// 2. P in keyof T 拿出所有的key，在extends K，如果是true，则返回 P
type MyPick<T, K extends keyof T> = {
[P in keyof T as P extends K ? P : never]: T[P];
};

type TodoPreviewMy = MyPick<Todo, "title" | "completed">;
// type TodoPreviewMy = {
//     title: string;
//     completed: boolean;
// }
const todo: TodoPreviewMy = {
    title: "Clean room",
    completed: false,
};