Last updated: Feb 28, 2024
Reading timeยท5 min
Use the Partial
utility type to make all of the properties in a type
optional.
The Partial
utility type constructs a new type with all properties of the
provided type set to optional.
interface Employee { id: number; name: string; salary: number; } const emp: Partial<Employee> = {}; emp.name = 'Bobby Hadz';
We used the Partial utility type to construct a new type with all of the properties of the provided type set to optional.
interface Employee { id: number; name: string; salary: number; } // ๐๏ธ type T = { // id?: number | undefined; // name?: string | undefined; // salary?: number | undefined; // } type T = Partial<Employee>;
The same approach can be used to get a type that consists of an object's properties where all of them are marked as optional.
const obj = { id: 1, name: 'Bobby Hadz', salary: 100, }; // ๐๏ธ type T = { // id?: number | undefined; // name?: string | undefined; // salary?: number | undefined; // } type T = Partial<typeof obj>;
Notice that we had to use the
typeof type operator, because
Partial
expects a type.
You can see how the built-in Partial
type is implemented in TypeScript's
Github repository.
/** * Make all properties in T optional */ type Partial<T> = { [P in keyof T]?: T[P]; };
The ?:
syntax is called a
mapping modifier
and is used to affect optionality.
You can also see +?:
being used, which achieves the same result. If you don't
add a prefix, then +
is assumed.
Mapping modifiers can affect optionality both ways, e.g. you can also use them
to make all of the properties of an
interface required by prefixing
the ?:
with a minus (-?:
).
+
is assumed, like in the Partial
utility type./** * Make all properties in T required */ type Required<T> = { [P in keyof T]-?: T[P]; };
This is the
code
for the Required
utility type, which makes all of the properties of the
provided type required.
Notice that the only character that changed is the minus in front of the question mark to use a mapping modifier that removes optionality.
I've also written a detailed guide on how to make one or all properties required.
To make all of the properties of a type optional except one, use an interface to
extend the type passing it to the Partial
utility type and then override the
specific property setting it to required.
interface Employee { id: number; name: string; salary: number; } interface OptionalExceptSalary extends Partial<Employee> { salary: number; } const emp: OptionalExceptSalary = { salary: 100, };
We used the Partial utility type to construct a type where all of the properties are set to optional.
interface Employee { id: number; name: string; salary: number; } // ๐๏ธ type Opt = { // id?: number | undefined; // name?: string | undefined; // salary?: number | undefined; // } type Opt = Partial<Employee>;
The only properties we want to override in the new interface are the ones we want to mark as required.
You can achieve the same result by using a type alias.
interface Employee { id: number; name: string; salary: number; } type OptionalExceptSalary = Partial<Employee> & { salary: number; }; const emp: OptionalExceptSalary = { salary: 100, };
You can use this approach to mark all properties except N as optional.
An alternative approach is to create a utility type that makes the specified properties optional.
interface Employee { id: number; name: string; salary: number; } type MakeOptional<Type, Key extends keyof Type> = Omit<Type, Key> & Partial<Type>; // ๐๏ธ mark salary as optional const emp: MakeOptional<Employee, 'salary'> = { id: 1, name: 'Bobby Hadz', };
The MakeOptional
utility type takes a type and one of the type's keys as
parameters and marks the specified key as optional (salary
in the example).
You don't have to only mark a single property as optional.
interface Employee { id: number; name: string; salary: number; } type MakeOptional<Type, Key extends keyof Type> = Omit<Type, Key> & Partial<Type>; // ๐๏ธ mark salary and name as optional const emp: MakeOptional<Employee, 'salary' | 'name'> = { id: 1, };
The Omit utility constructs a new type by picking all properties from the provided type and removing the specified keys.
interface Employee { id: number; name: string; salary: number; } // ๐๏ธ type T = { // id: number; // name: string; // } type T1 = Omit<Employee, 'salary'>; // ๐๏ธ type T2 = { // id: number; // } type T2 = Omit<Employee, 'salary' | 'name'>;
The first example looks something like the following.
interface Employee { id: number; name: string; salary: number; } // ๐๏ธ type T10 = { // id: number; // name: string; // } & Partial<Employee> type T10 = { id: number; name: string } & Partial<Employee>; // ๐๏ธ only salary is marked as optional const example: T10 = { id: 1, name: 'Bobby Hadz', };
To make a single property in a type optional, create a utility type that takes a type and the property name as parameters and constructs a new type with the specific property marked as optional.
interface Developer { language: string; age: number; experience: number; } type MakeOptional<Type, Key extends keyof Type> = Omit<Type, Key> & Partial<Pick<Type, Key>>; // ๐๏ธ mark experience as optional type T1 = MakeOptional<Developer, 'experience'>; const dev1: T1 = { age: 30, language: 'ts', }; // ๐๏ธ mark experience and age as optional type T2 = MakeOptional<Developer, 'experience' | 'age'>; const dev2: T2 = { language: 'ts', };
The MakeOptional
utility type takes a type and a property name as parameters
and returns a new type with the specified property marked as optional.
You can use the MakeOptional
utility type to mark one or some of the type's
properties as optional.
We used the Omit utility type to construct a new type by picking all of the properties from the provided type and removing the specified keys.
interface Developer { language: string; age: number; experience: number; } // ๐๏ธ type O1 = { // experience: number; // language: string; // } type O1 = Omit<Developer, 'age'>; // ๐๏ธ type O2 = { // language: string; // } type O2 = Omit<Developer, 'age' | 'experience'>;
Notice that we can specify more than one property name by separating them with a
pipe |
symbol
(called union type).
Now that we have a type with the specified properties removed, we use the Pick utility type to construct a type consisting only of the specified properties and mark them as optional via the Partial utility type.
interface Developer { language: string; age: number; experience: number; } // ๐๏ธ type P1 = { // language: string; // } type P1 = Pick<Developer, 'language'>; // ๐๏ธ type P2 = { // language: string; // age: number; // } type P2 = Pick<Developer, 'language' | 'age'>;
Partial
utility type is used to construct a new type with all of the properties of the provided type set to optional.Here is the entire code snippet.
interface Developer { language: string; age: number; experience: number; } type MakeOptional<Type, Key extends keyof Type> = Omit<Type, Key> & Partial<Pick<Type, Key>>; // ๐๏ธ mark experience as optional type T1 = MakeOptional<Developer, 'experience'>; const dev1: T1 = { age: 30, language: 'ts', }; // ๐๏ธ mark experience and age as optional type T2 = MakeOptional<Developer, 'experience' | 'age'>; const dev2: T2 = { language: 'ts', };
In summary, the Omit<Type,Key>
part gets us a type that excludes all of the
specified properties.
The Pick<Type,Key>
syntax gets us a type that consists only of the specified
properties.
The Partial<>
utility type makes the specified properties optional.
The MakeOptional
utility type can be used to mark one or more of a type's
properties as optional.
You can learn more about the related topics by checking out the following tutorials: