Loading lessons...
Mapped Types & Template Literal Types
Mapped Types & Template Literal Types
Mapped types create new types by iterating over keys of an existing type. Template literal types build string types dynamically using template syntax.
Mapped Types Syntax
type ReadOnlyObject<T> = {
readonly [K in keyof T]: T[K];
};
type OptionalObject<T> = {
[K in keyof T]?: T[K];
};
interface User {
id: number;
name: string;
}
type ReadonlyUser = ReadOnlyObject<User>;
Key Remapping with as
type Getters<T> = {
[K in keyof T as `get${Capitalize<string & K>}`]: () => T[K];
};
interface Person {
name: string;
age: number;
}
type PersonGetters = Getters<Person>;
/*
Resulting type:
{
getName: () => string;
getAge: () => number;
}
*/
Template Literal Types
type Event = "click" | "hover";
type EventHandler = `on${Capitalize<Event>}`; // "onClick" | "onHover"
TL;DR
- Mapped types iterate over keys using
[K in keyof T]. - Key remapping using
ascan transform property names dynamically. - Template literal types manipulate string literal unions at compile time.