100% Free Forever
AI-Powered Learning
Industry Expert Content
Certificates & Badges
Learn At Your Own Pace

What Are TypeScript Utility Types Like Partial and Pick?

Learn TypeScript utility types like Partial, Pick, Omit, and Readonly for deriving new types from one source of truth.

mediumQ208 of 224 in Web Development Est. time: 5 minsLast updated:
Open Code Lab

Expected Interview Answer

Utility types are built-in generic type transformations, such as Partial, Pick, Omit, and Readonly, that derive a new type from an existing one instead of forcing you to hand-write a near-duplicate interface every time you need a slightly different shape.

Given an interface like `User { id: string; name: string; email: string }`, `Partial<User>` produces a type where every property becomes optional, useful for update payloads where only changed fields are sent. `Pick<User, "id" | "name">` extracts just those two properties into a new type, while `Omit<User, "email">` produces the inverse, keeping everything except email. `Readonly<User>` marks every property as immutable so reassignment is a compile error, and `Record<K, V>` builds an object type mapping every key in K to values of type V. These are all implemented internally using TypeScript’s mapped types and conditional types, so they are not magic — you could write them yourself — but using the built-ins keeps intent clear and avoids maintaining parallel interfaces that drift out of sync whenever the base type changes.

  • Derives new shapes from a single source of truth instead of duplicating interfaces
  • Keeps update/patch payload types automatically in sync with the base type
  • Readonly and Pick/Omit reduce accidental mutation and over-broad object shapes
  • Reduces maintenance: changing the base interface propagates to all derived types

AI Mentor Explanation

Utility types are like a scoreboard template generator: instead of designing a brand-new board layout for every match format, you derive a “practice-session board” that makes every stat optional, or a “quick-glance board” that picks only runs and overs from the full template. Omit-style boards drop categories like extras entirely while keeping everything else. Because every derived board still traces back to the one master template, updating the master automatically updates every derived version. That derive-instead-of-redesign approach is exactly what TypeScript utility types do with interfaces.

Step-by-Step Explanation

  1. Step 1

    Start with a base interface

    Define one source-of-truth type describing the full shape, e.g. User.

  2. Step 2

    Apply a utility type

    Use Partial<User>, Pick<User, "id" | "name">, Omit<User, "email">, or Readonly<User> as needed.

  3. Step 3

    Compiler derives the new shape

    TypeScript computes the resulting type via mapped/conditional types under the hood.

  4. Step 4

    Base type changes propagate

    Editing the source interface automatically updates every derived utility-type usage.

What Interviewer Expects

  • Ability to name and explain several utility types: Partial, Pick, Omit, Readonly, Record
  • Understanding that utility types derive from a single source interface, avoiding duplication
  • Awareness that utility types are implemented via mapped/conditional types, not special magic
  • A concrete example of where a derived type (like an update payload) is genuinely useful

Common Mistakes

  • Hand-writing a near-duplicate interface instead of deriving it with a utility type
  • Confusing Pick (keep listed keys) with Omit (remove listed keys)
  • Assuming Readonly<T> provides runtime immutability instead of just compile-time protection
  • Not realizing utility types can be composed, e.g. Partial<Pick<User, "name" | "email">>

Best Answer (HR Friendly)

TypeScript utility types let you take one type you already defined, like a User shape, and quickly create variations of it — one where every field is optional for updates, one with only a couple of fields for a summary view, or one with a field removed for public display — without writing and maintaining several near-identical types by hand.

Code Example

Deriving shapes from one base interface
interface User {
  id: string
  name: string
  email: string
}

type UserUpdate = Partial<User> // every field optional, for PATCH payloads
type UserSummary = Pick<User, 'id' | 'name'> // only id and name
type PublicUser = Omit<User, 'email'> // everything except email
type FrozenUser = Readonly<User> // no property can be reassigned

function updateUser(id: string, changes: UserUpdate): void {
  // changes.name, changes.email, changes.id are all optional here
}

Follow-up Questions

  • How would you implement your own version of Partial<T> using mapped types?
  • What is the difference between Record<K, V> and an index signature?
  • How do Pick and Omit interact with union types?
  • What is the difference between Readonly<T> and the `as const` assertion?

MCQ Practice

1. What does Partial<User> produce?

Partial<T> maps every property in T to an optional version of itself.

2. What is the difference between Pick and Omit?

Pick<T, K> extracts K from T; Omit<T, K> returns T minus the keys in K.

3. What are TypeScript utility types implemented with internally?

Built-in utility types like Partial and Pick are defined using mapped types and conditional types.

Flash Cards

What does Partial<T> do?Makes every property of T optional.

What does Pick<T, K> do?Creates a type with only the listed keys K from T.

What does Omit<T, K> do?Creates a type with every property of T except the listed keys K.

Why use utility types instead of new interfaces?They derive from one source of truth, so base-type changes propagate automatically.

1 / 4

Continue Learning