TYPESCRIPT

TypeScript Partial Type: Syntax, Use Cases, and Examples

The Partial utility type transforms all properties of an object into optional ones. It’s particularly useful when working with scenarios like form inputs, updates to existing data, or configuration objects. Instead of manually making each property optional in a large interface, you can use Partial to create a flexible version of that type while preserving its structure.


What Is Partial?

The Partial type is a built-in generic utility that converts all properties of a given type into optional properties. It is defined like this:

type Partial<T> = {
  [P in keyof T]?: T[P];
};

This means for a type T, Partial<T> creates a new type where every property is optional but still maintains the same property names and value types.

This is especially useful for scenarios like patch updates (updating only a portion of an object), constructing objects incrementally, or defining default configuration options.


Syntax of Partial

You can create a partial type like this:

Partial<Type>

Example:

type User = {
  id: number;
  name: string;
  email: string;
};

type UpdateUser = Partial<User>;

Now, UpdateUser is:

{
  id?: number;
  name?: string;
  email?: string;
}

You can use any combination of these fields or none at all.


Why Use the Partial Type?

Using Partial reduces boilerplate and makes your code more flexible when dealing with incomplete data. This utility type is especially valuable when you’re dealing with:

  • Optional configurations
  • Form data
  • Patch operations in APIs
  • Component props that should allow partial override
  • Object construction over time

Instead of creating entirely new types or adding question marks manually to each property, you can use Partial once and get the desired effect.


Partial Type Example: Updating User Info

Let’s say you have a user object that needs to be partially updated:

type User = {
  id: number;
  name: string;
  email: string;
  password: string;
};

function updateUser(id: number, updates: Partial<User>) {
  // Only apply provided updates
}

In this case, the updates argument can include any subset of the user fields. You’re no longer required to pass the entire user object for a simple change like an email update.


Interface Partial Usage

You can use Partial with interfaces in the same way as with regular types.

interface Product {
  id: string;
  name: string;
  price: number;
  description?: string;
}

type DraftProduct = Partial<Product>;

Now DraftProduct allows all fields to be omitted, including those that were originally required. This is helpful when creating form states or staging incomplete objects.


Nested Partial

If your data structure includes nested objects, the built-in Partial only makes top-level properties optional. For example:

type Profile = {
  name: string;
  preferences: {
    theme: string;
    notifications: boolean;
  };
};

type PartialProfile = Partial<Profile>;

In PartialProfile, the preferences object is still required, but its inner fields remain mandatory. To make nested properties optional as well, you’ll need a deep Partial approach.


Deep Partial

To make all properties optional recursively, including nested objects, you can define a custom type like:

type DeepPartial<T> = {
  [P in keyof T]?: T[P] extends object ? DeepPartial<T[P]> : T[P];
};

Using this, you can do:

type Config = {
  database: {
    host: string;
    port: number;
  };
  logging: {
    level: string;
  };
};

type PartialConfig = DeepPartial<Config>;

Now, PartialConfig allows you to define partial versions of any nested field, such as:

const configUpdate: PartialConfig = {
  database: {
    port: 5432
  }
};

The Partial pattern is helpful for deeply nested forms, configurations, or state trees.


Combining Partial with Other Utility Types

You can compose Partial with Pick, Omit, or even Readonly to create more targeted types. For example:

Partial + Pick

type Product = {
  id: string;
  name: string;
  price: number;
};

type OptionalFields = Partial<Pick<Product, 'name' | 'price'>>;

This results in a type with just name and price as optional fields—useful when selectively updating specific parts of an object.

Partial + Omit

type SecureUser = Omit<User, 'password'>;
type EditableSecureUser = Partial<SecureUser>;

This creates a version of User where password is excluded and the rest are optional.


How to Use Partial for Form Values

Forms are one of the most common use cases for Partial. When building a form to update only parts of an object, you can use Partial to represent the shape of the form state.

type User = {
  name: string;
  email: string;
  age: number;
};

type FormState = Partial<User>;

const form: FormState = {
  email: 'user@example.com'
};

You’re not required to initialize every field, and your form logic can still maintain type safety by referencing the original type.


Partial with Class Instances

When using class constructors, you can accept a Partial object to initialize values more flexibly.

class User {
  id: number;
  name: string;

  constructor(data: Partial<User>) {
    this.id = data.id ?? 0;
    this.name = data.name ?? 'Unknown';
  }
}

This allows you to provide only part of the object during instantiation, useful for test data or when fetching user details incrementally.


Performance and IDE Benefits

The Partial utility is a compile-time type transformation. It has no impact on performance at runtime but provides strong typing benefits during development.

Editors like VS Code support Partial with:

  • Autocompletion for all fields
  • Type-checking of property values
  • Error detection when assigning incorrect types

These benefits help reduce bugs and make code more maintainable over time.


Real-World Use Cases

API Request Objects

In many APIs, update routes only accept a subset of fields:

type PatchUserRequest = Partial<User>;

You don’t need to repeat the fields allowed for patching—Partial handles that for you.

Configuration Objects

Default configuration merging often involves partial overrides:

const defaultConfig: Config = { ... };
const userConfig: Partial<Config> = { logging: { level: 'debug' } };

This provides a flexible but safe way to override default settings.

React Props

Partial can be useful for creating flexible prop definitions:

type ComponentProps = {
  title: string;
  subtitle: string;
};

type OptionalProps = Partial<ComponentProps>;

This is especially helpful when using wrapper components or applying default values.


Summary

The Partial utility type offers a powerful way to make all properties in a type optional. It simplifies data handling in scenarios where full object definitions aren't required, such as form submissions, configuration objects, and incremental updates. You can use it with interfaces, combine it with other utility types, or even implement a recursive version for deeply nested structures.

Learn TypeScript for Free
Start learning now
button icon
To advance beyond this tutorial and learn TypeScript by doing, try the interactive experience of Mimo. Whether you're starting from scratch or brushing up your coding skills, Mimo helps you take your coding journey above and beyond.

Sign up or download Mimo from the App Store or Google Play to enhance your programming skills and prepare for a career in tech.

You can code, too.

© 2025 Mimo GmbH

Reach your coding goals faster