Utility, Mapped and Conditional Types

What you'll build

A user-management module that derives all its types from one User definition: an update payload, a public profile, a form-field map, and a type-safe event name generator.

The idea

Instead of rewriting similar types by hand, derive them. TypeScript ships utility types and lets you write your own.

Built-in utilities:

• Partial<T>: all properties optional (update payloads).
• Required<T>: all properties required.
• Readonly<T>: all properties read-only.
• Pick<T, "a" | "b"> and Omit<T, "a">: keep or drop properties.
• Record<K, V>: an object with keys K and values V.
• ReturnType<typeof fn> and Parameters<typeof fn>: types taken from a function.
• Awaited<Promise<T>>: the value type of a promise.
• NonNullable<T>: removes null and undefined.

Your own building blocks:

• Mapped types loop over keys: { [K in keyof T]: boolean }. Add ? or readonly modifiers, remap keys with as.
• Conditional types choose a type by a test: T extends string ? "text" : "other". infer captures a part, as in T extends Promise<infer U> ? U : T.
• Template literal types build string types: `on${Capitalize<K>}`.

Reach for these when types would otherwise duplicate each other, and stop when a type becomes hard to read.

The code

interface User {
  id: number;
  name: string;
  email: string;
  role: "admin" | "editor" | "viewer";
  createdAt: Date;
}

// Built-in utilities
type UserUpdate = Partial<Omit<User, "id" | "createdAt">>;
type PublicUser = Pick<User, "id" | "name" | "role">;
type RoleCounts = Record<User["role"], number>;

function applyUpdate(user: User, update: UserUpdate): User {
  return { ...user, ...update };
}

const user: User = { id: 1, name: "Ada", email: "[email protected]", role: "editor", createdAt: new Date(0) };
const updated = applyUpdate(user, { role: "admin" });
const profile: PublicUser = { id: updated.id, name: updated.name, role: updated.role };
console.log(profile);

const counts: RoleCounts = { admin: 1, editor: 0, viewer: 0 };
console.log(counts);

// Mapped type: a form-field map where every property becomes a string
type FormFields<T> = { [K in keyof T]: string };
const form: FormFields<Pick<User, "name" | "email">> = { name: "Ada", email: "[email protected]" };
console.log(form);

// Mapped type with key remapping and a template literal type
type Getters<T> = { [K in keyof T as `get${Capitalize<string & K>}`]: () => T[K] };
type UserGetters = Getters<Pick<User, "name" | "role">>;
const getters: UserGetters = { getName: () => user.name, getRole: () => user.role };
console.log(getters.getName(), getters.getRole());

// Conditional type with infer
type ElementOf<T> = T extends (infer U)[] ? U : T;
type A = ElementOf<string[]>;   // string
type B = ElementOf<number>;     // number
const a: A = "text";
const b: B = 42;
console.log(a, b);

// Types taken from a function
function makeTodo(title: string) {
  return { title, done: false, tags: [] as string[] };
}
type Todo = ReturnType<typeof makeTodo>;
const todo: Todo = makeTodo("Learn mapped types");
console.log(todo);

// @ts-expect-error: id is not allowed in an update
applyUpdate(user, { id: 2 });

{ id: 1, name: 'Ada', role: 'admin' }
{ admin: 1, editor: 0, viewer: 0 }
{ name: 'Ada', email: '[email protected]' }
Ada editor
text 42
{ title: 'Learn mapped types', done: false, tags: [] }

Common mistakes

• Using Partial for everything. A Partial<User> allows an empty object; if some fields are required, combine Pick and Partial.
• Writing a conditional type when a union or overload is simpler. Conditional types are for relationships between types.
• Building unreadable type puzzles. If a teammate cannot read it, add a name, a comment, or use a simpler design.
• Expecting types to validate runtime data. Partial<User> does nothing for JSON arriving from a network call; validate it with code.
• Forgetting string & K when using Capitalize on keyof T, because keys can be symbols or numbers too.

Key points

• Derive types with Partial, Required, Readonly, Pick, Omit, Record, ReturnType and Awaited.
• Mapped types ({ [K in keyof T]: ... }) transform every property; as remaps keys.
• Conditional types (T extends U ? X : Y) with infer extract parts of types.
• Template literal types build string types such as getName from name.

Further reading: The Handbook: Utility Types and Creating Types from Types.