Conditional Types

Conditional types in TypeScript allow you to create types that adapt dynamically based on a condition, making your code more flexible and reusable.

They use a syntax similar to JavaScript's conditional (ternary) operator.

Conditional types allow you to define a type that depends on another type. The basic syntax is:

T extends U ? X : Y

This means: If T extends U, the type is X, otherwise it is Y.

Here’s a simple example:

type IsString<T> = T extends string ? 'Yes' : 'No';

// Test cases
type A = IsString<string>; // 'Yes'
type B = IsString<number>; // 'No'

Conditional types can simplify function overloads by dynamically determining return types:

type ReturnType<T> = T extends (...args: any[]) => infer R ? R : never;

function getData(): string {
  return 'Hello';
}

type DataType = ReturnType<typeof getData>; // string

When conditional types are applied to union types, they are distributed across each member of the union:

type ToArray<T> = T extends any ? T[] : never;

type A = ToArray<string | number>;
// A = string[] | number[]

You can combine conditional types with mapped types for powerful type transformations:

type User = {
  id: number;
  name: string;
  isAdmin?: boolean;
};

type MakeRequired<T> = {
  [K in keyof T]-?: T[K] extends undefined ? never : T[K];
};

type RequiredUser = MakeRequired<User>;
// { id: number; name: string; isAdmin: never; }

Conditional types are commonly used for:

• Inferring return types or parameters.
• Transforming unions and intersections.
• Creating utility types like Exclude, Extract, and NonNullable.

Create a conditional type that checks if a type is an array and, if so, returns its element type; otherwise, it returns the type itself.

You’ve learned how to use conditional types to create dynamic and reusable type definitions in TypeScript. Practice these concepts to write more powerful and flexible TypeScript code!