Typescript Custom Utility Types Ontwerpen
description
Met deze prompt leer je hoe je eigen utility types kunt maken die precies aansluiten op je specifieke behoeften, wat je meer flexibiliteit en controle geeft dan de standaard utility types. Dit lost problemen op waar standaard types tekortschieten en helpt je types effectiever en herbruikbaarder te maken.
prompt
Leg uit hoe ik in Typescript mijn eigen utility types kan ontwerpen om specifieke type-transformaties uit te voeren voor <beschrijving van het data model of type transforma ...
try_prompt
generate_helper
disclaimerOnPageApi
tags
ai_answers
provider: openai
model: gpt-4.1-nano
In TypeScript kun je je eigen utility types maken door gebruik te maken van conditional types, mapped types en inferentie. Om bijvoorbeeld alleen de string-eigenschappen van een interface optioneel te maken, kun je een custom utility type definiëren dat dit automatisch doet.
Hier is een voorbeeld van zo'n utility type:
```typescript
// Utility type die alle string properties optioneel maakt
type MakeStringPropertiesOptional<T> = {
[K in keyof T]: T[K] extends string ? T[K] | undefined : T[K];
};
```
**Uitleg:**
- `[K in keyof T]` doorloopt alle keys van T.
- `T[K] extends string` gebruikt een conditional type om te checken of de property een string is.
- Als dat zo is, maakt het de property optioneel door `T[K] | undefined`.
- Anders laat het de property onveranderd.
**Voorbeeld gebruik:**
```typescript
interface MyInterface {
name: string;
age: number;
description: string;
isActive: boolean;
}
type OptionalStrings = MakeStringPropertiesOptional<MyInterface>;
/* Resultaat:
type OptionalStrings = {
name?: string | undefined;
age: number;
description?: string | undefined;
isActive: boolean;
}
*/
```
---
**Verder gaan dan standaard utility types**
Je kunt complexere transformaties maken met inferentie en conditional types. Bijvoorbeeld, een utility type dat alleen de string properties *verandert* naar optioneel, maar andere types ongewijzigd laat, en dat je ook nog meer controle geeft:
```typescript
type CustomMakeOptional<T> = {
[K in keyof T]: T[K] extends string ? T[K] | undefined : T[K];
};
```
Of, als je bijvoorbeeld eigenschappen wilt die gebaseerd zijn op meer complexe condities, kun je inferentie gebruiken:
```typescript
type MakeStringPropertiesOptionalInfer<T> = {
[K in keyof T]: T[K] extends infer U ? (U extends string ? U | undefined : U) : never;
};
```
**Samenvatting:**
- Gebruik `[K in keyof T]` voor mapped types.
- Gebruik conditional types zoals `T[K] extends string` om eigenschappen te selecteren.
- Gebruik `| undefined` om properties optioneel te maken.
- Combineer met inferentie voor meer complexe transformaties.
Met deze technieken kun je zeer flexibele en krachtige utility types ontwerpen die specifiek gedrag voor je interfaces definiëren.
provider: deepseek
model: deepseek-chat
Zeker, ik leg uit hoe je eigen utility types ontwerpt in TypeScript voor dit specifieke gebruik. Hier is een complete uitleg met voorbeelden:
## Basis Utility Type: Alleen string properties optioneel maken
```typescript
type MakeStringPropertiesOptional<T> = {
[K in keyof T]: T[K] extends string ? T[K] | undefined : T[K];
};
```
## Geavanceerdere versie met conditional types
```typescript
type OptionalStringProperties<T> = {
[K in keyof T]: T[K] extends string ? T[K] | undefined : T[K];
} & {
[K in keyof T as T[K] extends string ? K : never]?: T[K];
};
```
## Voorbeeld interface en gebruik
```typescript
interface User {
id: number;
name: string;
email: string;
age: number;
isActive: boolean;
createdAt: Date;
}
// Onze custom utility type toepassen
type UserWithOptionalStrings = OptionalStringProperties<User>;
// Resultaat:
/*
type UserWithOptionalStrings = {
id: number;
name?: string | undefined;
email?: string | undefined;
age: number;
isActive: boolean;
createdAt: Date;
}
*/
```
## Complexer voorbeeld met inferentie en conditional types
```typescript
// Utility type dat alleen string properties selecteert
type StringKeys<T> = {
[K in keyof T]: T[K] extends string ? K : never;
}[keyof T];
// Utility type dat niet-string properties selecteert
type NonStringKeys<T> = {
[K in keyof T]: T[K] extends string ? never : K;
}[keyof T];
// Gecombineerde utility type
type MakeStringsOptional<T> =
// Behoud niet-string properties
Pick<T, NonStringKeys<T>> &
// Maak string properties optioneel
Partial<Pick<T, StringKeys<T>>>;
// Gebruik
type ModifiedUser = MakeStringsOptional<User>;
```
## Nog geavanceerder: Met mapped types en conditional inference
```typescript
type OptionalStringProps<T> = {
[K in keyof T]:
T[K] extends string ?
T[K] | undefined :
T[K] extends infer U ?
U extends object ?
OptionalStringProps<U> :
U :
never;
};
// Voor nested objecten
interface Profile {
user: User;
settings: {
theme: string;
notifications: boolean;
language: string;
};
}
type OptionalStringProfile = OptionalStringProps<Profile>;
```
## Utility type met default values
```typescript
type WithStringDefaults<T, D extends Partial<Record<StringKeys<T>, string>>> =
OptionalStringProperties<T> & {
[K in keyof D]: D[K];
};
// Gebruik met default values
const defaultStrings = {
name: "Gast",
email: "guest@example.com"
} as const;
type UserWithDefaults = WithStringDefaults<User, typeof defaultStrings>;
```
## Tips voor je eigen utility types:
1. **Begin eenvoudig** en bouw complexiteit geleidelijk op
2. **Test je types** met verschillende interfaces
3. **Gebruik `extends`** voor conditional type checking
4. **Experimenteer met `infer`** voor complexe type extracties
5. **Combineer utility types** voor meer krachtige transformaties
Deze custom utility types geven je veel flexibiliteit om type-transformaties precies aan te passen aan je specifieke behoeften.