タイプチャレンジのある TypeScript アドベンチャー – Day Pick

皆さん、こんにちは。
TypeScript をさらに深く掘り下げるために、型チャレンジに取り組んでいます。

今日は、Pick について学んだことを共有したいと思います。

- 挑戦 -

interface Todo {
  title: string
  description: string
  completed: boolean
}

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

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

組み込みの Pick ジェネリックを使用せずに実装します。
T からプロパティ K のセットを選択して型を構築します。

- 説明 -

課題は、TypeScript が標準ユーティリティとして提供する独自のバージョンの Pick ユーティリティ タイプを作成することです。

- 私の解決策 -

interface Todo {
  title: string;
  description: string;
  completed: boolean;
}

type MyPick<T, U extends keyof T> = {
  [k in U]: T[k];
};

type TodoPreview = MyPick<Todo, "title" | "completed">;

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

- 説明 -

一行ずつ説明しましょう。

最初の行で、MyPick は 2 つの引数を受け取ります: T と U extends keyof T。

T：すべてのプロパティを含む基本型。
U extends keyof T：出力タイプに含めるプロパティを指定します。

keyofについて
拡張について

2 行目、
指定された引数から指定されたプロパティのみを抽出する新しい型を作成します。

[k in U] などのマップされた型について

以下のように、Todo から説明を除いた新しいタイプをタイトルのみを指定して作成し、MyPick に完成させます。

コーディングを楽しんでください☀️

以上がタイプチャレンジのある TypeScript アドベンチャー – Day Pickの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。