NJOKU SAMSON EBERE

Posted on May 15

Mastering TypeScript Utility Types: Partial, Pick, Omit, Record & More

#typescript #javascript #tutorial #programming

TypeScript utility types are powerful tools that help developers write cleaner, more maintainable, and type-safe code. Whether you’re building frontend apps with React or backend APIs with Node.js, utility types let you transform and manipulate types without rewriting logic.

🎥 Watch the full tutorial video here:

🔍 What You'll Learn

This video and blog cover the most commonly used TypeScript utility types:

Partial<T>
Pick<T, K>
Omit<T, K>
Record<K, T>
Readonly<T>
Required<T>

`Partial<T>`

Makes all properties in a type optional.

interface User {
  id: number;
  name: string;
  email: string;
}

const updateUser = (id: number, updates: Partial<User>) => {
  // updates can include one or more fields
};

✅ Useful for update forms or PATCH requests.

`Pick<T, K>`

Creates a new type by picking a subset of properties.

interface User {
  id: number;
  name: string;
  email: string;
}

type UserPreview = Pick<User, "id" | "name">;

const preview: UserPreview = {
  id: 1,
  name: "Jane",
};

✅ Great for displaying minimal data in components or lists.

`Omit<T, K>`

Creates a new type by omitting specific properties.

interface User {
  id: number;
  name: string;
  email: string;
}

type UserWithoutEmail = Omit<User, "email">;

const user: UserWithoutEmail = {
  id: 1,
  name: "John",
};

✅ Ideal when hiding sensitive fields (e.g., passwords, emails).

`Record<K, T>`

Creates an object type with keys of type K and values of type T.

type Roles = "admin" | "user" | "guest";

const permissions: Record<Roles, boolean> = {
  admin: true,
  user: true,
  guest: false,
};

✅ Useful for enums, permission sets, or configuration maps.

`Readonly<T>`

Makes all properties in a type immutable.

interface Settings {
  theme: string;
  darkMode: boolean;
}

const config: Readonly<Settings> = {
  theme: "light",
  darkMode: false,
};

config.theme = "dark"; // ❌ Error: Cannot assign to 'theme'

✅ Prevents accidental mutations.

`Required<T>`

Makes all optional properties required.

interface Profile {
  username?: string;
  bio?: string;
}

type CompleteProfile = Required<Profile>;

const user: CompleteProfile = {
  username: "samnjoku",
  bio: "Dev Advocate",
};

✅ Useful when ensuring that an object is fully populated before sending.

📺 Watch & Share

📺 Watch the full YouTube video here and get hands-on with real-world examples.

If you found the content helpful, please like, comment, and subscribe to support the channel!

🧠 Bonus Tip

You can combine utility types like this:

type EditableUser = Partial<Omit<User, "id">>;

This makes all properties except id optional.

Thanks for reading and watching!
Let me know in the comments: Which TypeScript utility type do you use the most?

DEV Community