Inleiding tot TypeScript Mapped Types

Mapped types in TypeScript bieden een manier om nieuwe types te creëren door bestaande te transformeren. Ze zijn een krachtig hulpmiddel voor het verwerken van complexe typebewerkingen en het garanderen van typeveiligheid in TypeScript-toepassingen. Dit artikel introduceert mapped types, legt hun syntaxis uit en geeft voorbeelden om hun gebruik te demonstreren.

Wat zijn toegewezen typen?

Mapped types maken het mogelijk om nieuwe types te creëren door een transformatie toe te passen op elke eigenschap van een bestaand type. Ze worden vaak gebruikt om types op een flexibele manier te wijzigen of uit te breiden. De basissyntaxis van een mapped type is:

type MappedType = {
  [K in keyof T]: NewType;
};

In deze syntaxis:

• T is het originele type.
• K vertegenwoordigt elke toets in T.
• NewType is het nieuwe type dat aan elke eigenschap is toegewezen.

Basisvoorbeeld van toegewezen typen

Hier is een eenvoudig voorbeeld van een toegewezen type dat alle eigenschappen van een bepaald type omzet naar alleen-lezen:

type ReadOnly = {
  readonly [K in keyof T]: T[K];
};

type User = {
  name: string;
  age: number;
};

type ReadOnlyUser = ReadOnly;

In dit voorbeeld transformeert het toegewezen type ReadOnly alle eigenschappen van het type User naar alleen-lezen, wat resulteert in een nieuw type ReadOnlyUser waarin alle eigenschappen onveranderlijk zijn.

Toegewezen typen met typetransformaties

Mapped types kunnen ook worden gebruikt om types op complexere manieren te transformeren. Bijvoorbeeld, een mapped type dat alle eigenschappen optioneel maakt:

type Partial = {
  [K in keyof T]?: T[K];
};

type User = {
  name: string;
  age: number;
};

type PartialUser = Partial;

In dit voorbeeld maakt het toegewezen type Partial alle eigenschappen van het type User optioneel, wat resulteert in een nieuw type PartialUser waarbij elke eigenschap optioneel is.

Toegewezen typen gebruiken met voorwaardelijke typen

Mapped types kunnen worden gecombineerd met conditionele types voor meer geavanceerde typebewerkingen. Bijvoorbeeld, het maken van een type dat alleen eigenschappen van een bepaald type bevat:

type OnlyStrings = {
  [K in keyof T]: T[K] extends string ? T[K] : never;
};

type User = {
  name: string;
  age: number;
  email: string;
};

type StringProperties = OnlyStrings;

In dit voorbeeld filtert het toegewezen type OnlyStrings eigenschappen eruit die niet van het type string zijn. Dit resulteert in een nieuw type StringProperties dat alleen tekenreekseigenschappen van het type User bevat.

Geavanceerde toegewezen typen

Geavanceerde use cases voor toegewezen typen omvatten het maken van typen die bestaande typen wijzigen op basis van verschillende voorwaarden. Bijvoorbeeld, een toegewezen type dat een suffix toevoegt aan elke eigenschapsnaam:

type WithSuffix<T, S extends string> = {
  [K in keyof T as `${string & K}${S}`]: T[K];
};

type User = {
  name: string;
  age: number;
};

type UserWithSuffix = WithSuffix<User, "Prop">;

In dit voorbeeld voegt het toegewezen type WithSuffix een achtervoegsel toe aan elke eigenschapsnaam van het type User, wat resulteert in een nieuw type UserWithSuffix waarbij eigenschapsnamen het opgegeven achtervoegsel hebben.

Conclusie

Mapped types in TypeScript zijn een veelzijdige functie waarmee ontwikkelaars nieuwe types kunnen maken door bestaande te transformeren. Door mapped types te begrijpen en te gebruiken, kunnen ontwikkelaars complexe typetransformaties beheren en zorgen voor een grotere typeveiligheid in hun TypeScript-code. Mapped types bieden krachtige mogelijkheden voor het verbeteren en aanpassen van typedefinities in TypeScript-toepassingen.