How to Exclude Property from Type in TypeScript ?

In Typescript, sometimes we need to exclude a property from a type when we want a similar type with some properties excluded or if we want to remove a property from the type.

There are several approaches to exclude properties from a type in typescript:

Approach 1: Using Mapped Types with conditional Types

In this approach, we create a new type by iterating the properties of the original type and conditionally excluding certain properties based on a type predicate.

Example: Here, we define a FullType interface with three properties. We then use the ExcludeProps type to create a new type called ExcludedType by excluding the ‘prop2’ property from FullType. Finally, we create an object of type ExcludedType called test.

Javascript

type FullType = {
    prop1: number;
    prop2: string;
    prop3: boolean;
};


type ExcludedType = ExcludeProps<FullType, 'prop2'>;


const test: ExcludedType = {
    prop1: 123,
    prop3: true,
};
console.log(test);

Output:

Approach 2: Using Pick and Omit Utility Types

In this approach we use TypeScript’s “Pick” and “Omit” utility types to explicitly include or exclude properties from a type.

Example: Here, we use “Omit” utility type to remove specified properties from the original type which excludes the property.

Similar to Approach 1, we create an ExcludedType by omitting the ‘prop2’ property from FullType using the Omit utility type.

Javascript

type FullType = {
    prop1: number;
    prop2: string;
    prop3: boolean;
};

type ExcludedType = Omit<FullType, 'prop2'>;


const test: ExcludedType = {
    prop1: 123,
    prop3: true,
};
console.log(test);

Output:

Approach 3: Using Intersection Types with Mapped Types

In this approach we intersect the original type with a mapped type that excludes the properties as we instruct.

Example: Here, we used a technique to create a new type by combining an existing type (FullType in this case) with a mapped type that excludes certain properties. Here, ExcludedType is defined as a type that includes all properties from FullType except for ‘prop2’. The test variable is declared to be of type ExcludedType. When initializing test, notice that ‘prop2’ is not included, but other properties like ‘prop1’ and ‘prop3’ are allowed.

Javascript

type FullType = {
    prop1: number;
    prop2: string;
    prop3: boolean;
};

type ExcludedType = FullType & { [K in 'prop2']?: never };


const test: ExcludedType = {
    prop1: 123,
    prop3: true,
};
console.log(test);

Output:

Approach 4: Using a Custom Type Guard Function

In this approach we define a custom type guard function that checks if a property should be excluded and then a new type is created using a conditional type.

The function excludeProp takes an object obj and a property prop, and it returns a new object omitting that property. The Omit utility type is used to create a new type by excluding the specified property from the original type.

Example: Here, ‘type ExcludedType = Omit<FullType, ‘prop2′>’ ; : This defines a type ExcludedType by omitting ‘prop2’ from FullType. ‘const test: ExcludedType = excludeProp(fullObj, ‘prop2′);’ : Here, test is declared to be of type ExcludedType, which means it doesn’t include ‘prop2’. The excludeProp function is called with fullObj (an object of type FullType) and ‘prop2’ as arguments. This will return a new object with ‘prop2’ excluded.

Javascript

type FullType = {
    prop1: number;
    prop2: string;
    prop3: boolean;
};

type ExcludedType = Omit<FullType, 'prop2'>;
const test: ExcludedType = excludeProp(fullObj, 'prop2');
console.log(test);

Output:

Approach 5: Using Exclude and Pick Utility Types

In this approach we utilize Typescript’s Exclude and Pick utility types to include or exclude properties based on their type.

The Exclude utility type is used to remove properties which the exclusion criteria. The Extract utility type retains properties which matches the inclusion criteria.

Example: Here, ‘Exclude<keyof FullType, ‘prop2′>:’ This part uses the Exclude utility type to remove properties matching the exclusion criteria. keyof FullType retrieves all the keys of the FullType type, and ‘prop2’ specifies the property to be excluded. ‘Pick<FullType, …>; ‘ : This part uses the Pick utility type to selectively include properties from FullType. The second argument specifies which properties to include after exclusion, based on the result of the Exclude operation.

Javascript

type FullType = {
    prop1: number;
    prop2: string;
    prop3: boolean;
};

type ExcludedType = Pick<FullType, Exclude<keyof FullType, 'prop2'>>;


const test: ExcludedType = {
    prop1: 123,
    prop3: true,
};
console.log(test);

Output: