Conditional type syntax in Typescript - Time & Space Complexity

Time Complexity: Conditional type syntax

O(n)

Understanding Time Complexity

We want to understand how the time it takes to evaluate a conditional type changes as the input type changes.

How does the complexity grow when TypeScript checks conditions on types?

Scenario Under Consideration

Analyze the time complexity of the following TypeScript conditional type.

type IsString<T> = T extends string ? true : false;

// Usage example:
type Test1 = IsString<string>;  // true
type Test2 = IsString<number>;  // false
    

This code checks if a type T is a string type and returns true or false accordingly.

Identify Repeating Operations

Look for repeated checks or evaluations in the conditional type.

• Primary operation: TypeScript checks if T extends string.
• How many times: Once per type evaluation; no loops or recursion here.

How Execution Grows With Input

The check is simple and happens once per type. Even if T is complex, this conditional runs a single check.

Input Size (n)	Approx. Operations
1 (simple type)	1 check
10 (union of 10 types)	10 checks (one per union member)
100 (union of 100 types)	100 checks

Pattern observation: The number of checks grows linearly with the number of union members in the input type.

Final Time Complexity

Time Complexity: O(n)

This means the time to evaluate grows in a straight line as the number of types to check increases.

Common Mistake

[X] Wrong: "Conditional types always run instantly regardless of input size."

[OK] Correct: When the input is a union type, TypeScript evaluates the condition for each member, so time grows with the number of members.

Interview Connect

Understanding how conditional types scale helps you write efficient type logic and shows you think about performance even in type-level code.

Self-Check

"What if we changed the conditional type to check nested conditional types? How would the time complexity change?"

Practice

1. What does a conditional type in TypeScript do?
T extends U ? X : Y

easy

A. Checks if T equals U and returns a boolean

B. Chooses type X if T is assignable to U, otherwise type Y

C. Creates a new type by combining T and U

D. Defines a function that returns X or Y

Solution

1. Step 1: Understand the conditional type syntax

   The syntax T extends U ? X : Y means if type T can be assigned to type U, then use type X.

2. Step 2: Interpret the meaning

   If T is not assignable to U, then the type becomes Y instead.

3. Final Answer:

   Chooses type X if T is assignable to U, otherwise type Y -> Option B

4. Quick Check:

   Conditional type picks between X and Y based on T extends U [OK]

Hint: Remember: condition ? trueType : falseType [OK]

Common Mistakes:

• Thinking it returns a boolean value
• Confusing extends with equality check
• Assuming it creates a function

2. Which of the following is the correct syntax for a conditional type in TypeScript?

easy

A. type Result = T extends U then X else Y;

B. type Result = if (T extends U) X else Y;

C. type Result = T extends U ? X : Y;

D. type Result = T ? U : X : Y;

Solution

1. Step 1: Recall the correct conditional type syntax

   TypeScript uses type Result = T extends U ? X : Y; to define conditional types.

2. Step 2: Identify incorrect options

   Options A, B, and C use invalid syntax not supported by TypeScript.

3. Final Answer:

   type Result = T extends U ? X : Y; -> Option C

4. Quick Check:

   Correct conditional type syntax uses ? and : [OK]

Hint: Look for ? and : after extends keyword [OK]

Common Mistakes:

• Using if-else keywords inside type definitions
• Misplacing question mark or colon
• Writing 'then' instead of '?'

3. What is the resulting type of this code?

type Check<T> = T extends string ? number : boolean;
type Result = Check<'hello'>;

medium

A. number

B. boolean

C. string

D. 'hello'

Solution

1. Step 1: Analyze the conditional type Check<T>

   If T extends string, then the type is number; otherwise boolean.

2. Step 2: Substitute T with 'hello'

   'hello' is a string literal, so it extends string, making the type number.

3. Final Answer:

   number -> Option A

4. Quick Check:

   'hello' extends string -> number [OK]

Hint: Check if type matches condition, then pick true branch [OK]

Common Mistakes:

• Confusing the output type with input type
• Assuming literal types don't extend their base types
• Choosing boolean instead of number

4. Identify the error in this conditional type:

type Example<T> = T extends number ? 'num' : 'not num'

medium

A. Conditional types cannot return string literals

B. Incorrect use of extends keyword

C. Missing semicolon after type definition

D. No error, syntax is correct

Solution

1. Step 1: Review the conditional type syntax

   The syntax type Example<T> = T extends number ? 'num' : 'not num' is valid in TypeScript.

2. Step 2: Check for syntax errors

   Semicolon after type alias is optional; string literals are valid return types.

3. Final Answer:

   No error, syntax is correct -> Option D

4. Quick Check:

   Conditional types can return string literals [OK]

Hint: Conditional types allow any valid type as result [OK]

Common Mistakes:

• Expecting semicolon is mandatory
• Thinking extends is only for classes
• Believing string literals can't be types

5. Given this conditional type:

type Flatten<T> = T extends any[] ? T[number] : T;

What is the type of Flatten<string[] | number>?

hard

A. string | number

B. string[] | number

C. string

D. number

Solution

1. Step 1: Understand the conditional type Flatten<T>

   If T is an array type, it returns the element type (T[number]), else returns T itself.

2. Step 2: Apply Flatten to union type string[] | number

   Conditional types distribute over unions, so Flatten<string[] | number> = Flatten<string[]> | Flatten<number> = string | number.

3. Final Answer:

   string | number -> Option A

4. Quick Check:

   Conditional types distribute over unions [OK]

Hint: Remember conditional types distribute over union types [OK]

Common Mistakes:

• Not distributing over union types
• Returning array type instead of element type
• Confusing T[number] with T