Unlock Powerful Generics: 3 Conditional Type Uses 2025

// SomeType extends OtherType ? TrueType : FalseType;
  

function wrapValue(value: string): { value: string };
function wrapValue(value: number): number;
function wrapValue(value: string | number): { value: string } | number {
  if (typeof value === "string") {
    return { value };
  }
  return value;
}

const wrappedString = wrapValue("hello"); // Type is { value: string }
const wrappedNumber = wrapValue(123);   // Type is number
  

The New Way: A Single Generic Function

With a conditional type, we can express this logic in a single, elegant generic function. First, we define our conditional type:

type WrappedType<T> = T extends string ? { value: T } : T;
  

This type reads: "If the generic type T is a string, then the resulting type is { value: T }. Otherwise, the type is just T." Now, we can use it in our function:

function wrapValue<T extends string | number>(value: T): WrappedType<T> {
  if (typeof value === "string") {
    // We need a type assertion here because TypeScript can't yet
    // fully connect the runtime check to our conditional type.
    return { value } as WrappedType<T>;
  }
  return value as WrappedType<T>;
}

const wrappedString = wrapValue("hello"); // Type is { value: string }
const wrappedNumber = wrapValue(123);   // Type is number
  

Comparison: Overloads vs. Conditional Type

Aspect	Function Overloads	Conditional Type
Readability	Separates declaration from implementation, can be confusing.	Type logic is centralized and declarative.
Scalability	Adding new types requires adding more overloads.	Can often extend the conditional type with nested ternaries.
Maintainability	Multiple signatures to keep in sync.	Single generic signature powered by a reusable utility type.

The conditional type approach is cleaner, more declarative, and ultimately more scalable.

Use Case 2: Unwrapping and Extracting Types

Have you ever needed to get the type of a value inside a Promise? Or the return type of a function? TypeScript's built-in utility types like Awaited<T> and ReturnType<T> are actually implemented using conditional types!

The magic ingredient here is the infer keyword. Used within the extends clause of a conditional type, infer lets you declare a new generic type variable right at the spot where TypeScript can deduce it.

Custom Unwrapper: GetPromiseType

Let's build our own version of Awaited<T> to see how it works. We want a type that extracts the inner value from a Promise.

// If T is a Promise of some type U, then give us U. Otherwise, give us T back.
type GetPromiseType<T> = T extends Promise<infer U> ? U : T;

// Let's test it out!
type StringPromise = Promise<string>;
type Name = GetPromiseType<StringPromise>; // Type is string

type Age = GetPromiseType<number>; // Type is number (since it's not a promise)
  

Here, infer U tells TypeScript: "If T matches the shape of a Promise<...>, please capture the type inside the angle brackets into a new type variable named U." We can then use U in the "true" branch of our conditional. This pattern is incredibly useful for creating utility types that can peer inside other types and pull out what you need.

Other examples of this pattern include:

• ReturnType<T>: Infers the return type of a function type.
• Parameters<T>: Infers the types of a function's parameters as a tuple.
• InstanceType<T>: Infers the instance type of a constructor function.

Understanding infer is the key to unlocking truly advanced type manipulation.

Use Case 3: Filtering Keys in Mapped Types

This is where conditional types go from useful to indispensable. Mapped types let us create new object types by transforming the properties of an existing type. When you combine them with conditional types, you can selectively include or exclude properties based on their value type.

Let's say we have a User interface and we want to create a new type that only contains the properties that are strings.

interface User {
  id: number;
  name: string;
  email: string;
  lastLogin: Date;
  isAdmin: boolean;
}
  

To achieve this, we can use a conditional type inside a mapped type. The trick is to use the never type. In a mapped type, if a property's type resolves to never, that property is omitted from the final object type.

// For each Key in T, check if the value type T[Key] extends U.
// If it does, keep the key. If not, make its type `never` to filter it out.
type PickByType<T, U> = {
  [K in keyof T as T[K] extends U ? K : never]: T[K];
};

// Let's use it!
type UserStringProperties = PickByType<User, string>;
/*
  Resulting type:
  {
    name: string;
    email: string;
  }
*/

type UserNumericProperties = PickByType<User, number>;
/*
  Resulting type:
  {
    id: number;
  }
*/
  

This is astonishingly powerful. We've created a reusable utility type, PickByType, that can filter any object's properties based on a type you provide. This pattern eliminates the need for manual `Pick` or `Omit` operations for type-based filtering and makes your code more robust to changes in the base `User` interface. If a new string property is added to `User`, UserStringProperties will automatically include it.

Conclusion: The Future is Conditional

Conditional types are more than just a fancy feature; they represent a fundamental shift in how we can work with TypeScript. By moving complex type logic from our brains (and from runtime checks) into the type system itself, we build safer, more self-documenting, and more flexible applications.

From creating dynamic return types to unwrapping promises and filtering object keys, the three use cases we've explored are just the beginning. As you become more comfortable with the extends... ? ... : ... syntax and the power of infer, you'll start seeing opportunities everywhere to make your types smarter and your code cleaner.

So, the next time you find yourself reaching for function overloads or writing repetitive utility types, take a moment and ask: "Can a conditional type solve this?" In 2025 and beyond, the answer will increasingly be a resounding "yes."