Mapped types iterate over keys to build new shapes. Combine with keyof and modifiers to add/remove readonly/optional flags. Key remapping (as) lets you change names.
type Readonly<T> = { readonly [K in keyof T]: T[K] };type User = { id: string; name?: string };
type ReadonlyUser = {
readonly [K in keyof User]: User[K];
};
type RequiredUser = {
[K in keyof User]-?: User[K];
};
// Key remapping
type EventHandlers<T> = {
[K in keyof T as `on${Capitalize<string & K>}`]: (value: T[K]) => void;
};
type Handlers = EventHandlers<{ click: MouseEvent; focus: FocusEvent }>;
// { onClick: (value: MouseEvent) => void; onFocus: (value: FocusEvent) => void }Understanding Mapped Types is fundamental to mastering TypeScript. Practice with the examples above and experiment with variations to solidify your knowledge.