Last updated: Apr 29, 2026

Advanced Types

Quick-return cheat sheet for generics, mapped types, conditional types, and template literal types.

Generics

function identity<T>(value: T): T { return value; }

function first<T extends { length: number }>(arr: T): T { return arr; }

function create<T = string>(value?: T): T { /* ... */ }

interface Box<T> { value: T; }

type Pair<A, B = A> = { first: A; second: B };

Mapped Types

Mapped types iterate over keys of an existing type with [K in keyof T] to produce a new type. You can add or remove modifiers (readonly, ?) and remap keys with as.

type Mutable<T> = { -readonly [K in keyof T]: T[K] };

type Optional<T> = { [K in keyof T]?: T[K] };

type Getters<T> = {
  [K in keyof T as `get${Capitalize<string & K>}`]: () => T[K];
};

Conditional Types

Conditional types choose between two branches based on an extends check: T extends U ? A : B. Combined with infer, they can extract types from structures — and they distribute automatically over unions.

type IsString<T> = T extends string ? true : false;

type Flatten<T> = T extends (infer U)[] ? U : T;

type UnwrapPromise<T> = T extends Promise<infer R> ? UnwrapPromise<R> : T;

Template Literal Types

type Event = `on${Capitalize<"click" | "focus">}`; // "onClick" | "onFocus"

type Path = `/${string}`;

type CSSValue = `${number}${"px" | "rem" | "em"}`;