Aventures TypeScript avec défis de type – Choix du jour

Bonjour à tous.
Je travaille sur des défis de type pour approfondir mes connaissances sur TypeScript.

Aujourd’hui, j’aimerais partager ce que j’ai appris sur le Pick.

- Le défi -

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

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

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

Implémentez le générique Pick intégré sans l'utiliser.
Construit un type en choisissant l'ensemble des propriétés K dans T.

- Description -

Le défi consiste à créer votre propre version du type d'utilitaire Pick, que TypeScript fournit en tant qu'utilitaire standard.

- Ma solution -

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,
};

- Explication -

Laissez-moi vous expliquer, ligne par ligne.

Sur la première ligne, MyPick reçoit deux arguments : T et U étend la clé de T.

T：Le type de base qui inclut toutes les propriétés.
U extends keyof T：Spécifie les propriétés à inclure dans le type de sortie.

À propos de keyof
À propos des extensions

Sur la deuxième ligne,
Il crée un nouveau type qui extrait uniquement les propriétés spécifiées de l'argument donné.

À propos des types mappés tels que [k in U]

Comme vous pouvez le voir ci-dessous, un nouveau type qui exclut la description de Todo est créé en fournissant uniquement le titre et complété dans MyPick.

Joyeux codage☀️

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!