Why conditional types are needed in Typescript - Challenge Your Understanding

Challenge - 5 Problems

❓ Predict Output

intermediate

What is the output of this conditional type example?

Consider this TypeScript code using conditional types. What is the type of Result?

Typescript

type IsString<T> = T extends string ? "Yes" : "No";
type Result = IsString<number>;

A "No"

B number

C "Yes"

D string

💡 Hint

Think about whether number extends string.

The conditional type checks if T extends string. Since number does not extend string, the type resolves to "No".

🧠 Conceptual

intermediate

Why are conditional types useful in TypeScript?

Which of the following best explains why conditional types are needed in TypeScript?

A They are used only for runtime value checks.

B They allow types to change based on other types, enabling flexible and reusable type logic.

C They replace all interfaces and classes in TypeScript.

D They make TypeScript code run faster.

💡 Hint

Think about how types can depend on other types.

Conditional types let you create types that depend on other types, making your type definitions more dynamic and reusable.

🔧 Debug

advanced

What error does this conditional type cause?

Look at this TypeScript code. What error will it produce?

Typescript

type Check<T> = T extends number ? "Number" : "Other";
type Result = Check<T>;

A No error, Result is "Number"

B No error, Result is "Other"

C Error: 'T' is not defined

D Error: Conditional type syntax error

💡 Hint

Check if the generic type parameter is declared.

The code uses T without declaring it as a generic parameter, causing a 'T is not defined' error.

❓ Predict Output

advanced

What is the output type of this nested conditional type?

Given this TypeScript code, what is the type of Final?

Typescript

type Nested<T> = T extends string ? (T extends "hello" ? "Greeting" : "String") : "Not String";
type Final = Nested<"hello">;

A "Greeting"

B "String"

C "Not String"

D string

💡 Hint

Check the inner conditional after the first condition passes.

Since "hello" extends string and also equals "hello", the type resolves to "Greeting".

🚀 Application

expert

How many keys does this conditional mapped type produce?

Consider this TypeScript code. How many keys does the type Filtered have?

Typescript

type FilterByType<T, U> = {
  [K in keyof T as T[K] extends U ? K : never]: T[K]
};

interface Data {
  id: number;
  name: string;
  active: boolean;
  score: number;
}

type Filtered = FilterByType<Data, number>;

A 1

B 3

C 4

D 2

💡 Hint

Count keys in Data whose type extends number.

Only 'id' and 'score' have type number, so Filtered has 2 keys.