Discriminated union narrowing in Typescript - Cheat Sheet & Quick Revision

Recall & Review

beginner

What is a discriminated union in TypeScript?

A discriminated union is a special kind of union type that uses a common literal property (called the discriminant) to tell which type in the union is being used. This helps TypeScript narrow down the type safely.

beginner

How does TypeScript use the discriminant property to narrow types?

TypeScript checks the value of the discriminant property in a conditional statement. Based on its value, it knows exactly which type from the union is active and narrows the type accordingly.

beginner

Example: Given a union type with a 'kind' property, how do you narrow it?

Use a switch or if statement on the 'kind' property. For example:<br>

switch (shape.kind) {<br>  case 'circle':<br>    // shape is Circle here<br>    break;<br>  case 'square':<br>    // shape is Square here<br>    break;<br>}

intermediate

Why is discriminated union narrowing safer than using type assertions?

Because TypeScript automatically checks the discriminant property and narrows the type, it prevents mistakes that can happen if you manually tell TypeScript a type without checking. This reduces bugs.

intermediate

What happens if you forget to handle one case in a discriminated union switch?

TypeScript can warn you if you enable strict checks. Missing a case means your code might not handle all possible types, which can cause runtime errors.

What property is essential for discriminated union narrowing in TypeScript?

A A numeric index signature

B A common literal property shared by all union members

C A method with the same name in all types

D An optional property

Discriminated unions rely on a common literal property (discriminant) to distinguish types.

How does TypeScript narrow a discriminated union inside a switch statement?

A By checking the value of the discriminant property in each case

B By guessing the type based on variable name

C By using runtime type information

D By ignoring the discriminant property

TypeScript uses the discriminant property's value in each case to narrow the type.

Which of these is a benefit of discriminated union narrowing?

A Automatic type safety without manual assertions

B Faster runtime performance

C Allows any property to be accessed without checks

D Removes the need for type annotations

Discriminated unions provide automatic type safety by narrowing types based on a property.

What keyword is commonly used to check the discriminant property in TypeScript?

A try

B for

C while

D switch

The switch statement is commonly used to check the discriminant property for narrowing.

If a discriminated union has a 'type' property with values 'A' or 'B', what happens if you check 'type === "A"'?

A TypeScript ignores the check

B TypeScript throws an error

C TypeScript narrows the variable to the type with 'type' equal to 'A'

D TypeScript narrows to both types

Checking the discriminant property value narrows the variable to the matching type.

Explain how discriminated union narrowing works in TypeScript and why it is useful.

Think about how a shared property helps TypeScript know the exact type.

Describe a simple example of a discriminated union and how you would use a switch statement to narrow its type.

Use shapes like circle and square with a 'kind' property.