Stop 07 · TypeScriptTopics · 7/12

Utility Types

In short

You have a User type, and now need 'User but every field optional' for an edit form. Instead of rewriting it, TypeScript's utility types make it in one line.

Built-in generic helper types (`Partial`, `Pick`, `Omit`, `Record`, `Readonly`, etc.) that transform existing types without rewriting them from scratch.

The jaadu mascot at a photocopy shop holds one original as three different copies come out.

Think of it like this

The photocopy shop options

You hand over one document and say 'only pages 2 to 4', 'leave out the last page' or 'make it read-only, no edits'. The original stays the same. Utility types are those options for your types.

Watch it happen

One User, many shapes

User (4 fields)

Omit password

Pick id, name

Omit id

Partial<...>

1/5User has id, name, email and password. Everything else is made from it.

The big ideas

What you need to know

Partial and Required

Partial<T> makes every field optional. Required<T> makes every field required.

Pick and Omit

Pick<T, "a" | "b"> keeps only those fields. Omit<T, "password"> keeps everything except them.

Record

Record<K, V> makes an object type with keys K and values V, like Record<string, number> for marks.

ReturnType and Awaited

ReturnType<typeof fn> grabs a function's return type. Awaited unwraps a Promise to its value.

See it in code

Walk through the code

1interface User {2  id: number;3  name: string;4  email: string;5  password: string;6}7 8type PublicUser = Omit<User, "password">;   // safe to send to the browser9type UserPreview = Pick<User, "id" | "name">;10type UserUpdate = Partial<Omit<User, "id">>; // edit form, all optional11 12const marks: Record<string, number> = { DSA: 82, DBMS: 76 };13 14async function getUser() { return { id: 1, name: "Arjun" }; }15type Fetched = Awaited<ReturnType<typeof getUser>>; // { id: number; name: string }

1/4The one source of truth: a User with four fields.

Change User once, and every type built from it updates automatically. No copy-paste drift.

Save yourself the pain

Common mistakes

Oops

Copying an interface and deleting fields by hand to make a variant.

Do this instead

Use Omit or Pick. When the original changes, the variant stays in sync.

Oops

Thinking Omit removes the password from the actual object.

Do this instead

Types vanish at runtime. You still have to leave the field out of the data you send.

Your mission

One type, many forms

~20 min

Quick check

You need a type for a 'Sign up' form that has every User field except id. Which fits best?

Go deeper

1Use `Partial<T>` to model a form's in-progress (incomplete) state.
2Use `Pick<T, K>` and `Omit<T, K>` to derive smaller types from a larger one.
3Skim the full list of built-in utility types in the TypeScript Handbook once.