Type alias for unions in Typescript - Step-by-Step Execution

Concept Flow - Type alias for unions

Define union types

↓

Create type alias

↓

Use alias in variables

↓

Assign values matching union

↓

Type checks pass or error

↓

End

This flow shows how to define a union type, create a type alias for it, use the alias for variables, assign values, and check types.

Execution Sample

Typescript

type Status = "success" | "error" | "loading";
let currentStatus: Status;
currentStatus = "loading";
currentStatus = "success";
// currentStatus = "done"; // Error

Defines a type alias 'Status' as a union of string literals and assigns valid values to a variable.

Execution Table

Step	Action	Evaluation	Result
1	Define type alias 'Status'	Status = "success" | "error" | "loading"	Alias created
2	Declare variable 'currentStatus' of type Status	currentStatus: Status	Variable declared
3	Assign 'loading' to currentStatus	currentStatus = "loading"	Valid assignment
4	Assign 'success' to currentStatus	currentStatus = "success"	Valid assignment
5	Assign 'done' to currentStatus	currentStatus = "done"	Type error: 'done' not in Status union

💡 Execution stops because 'done' is not part of the union type 'Status'

Variable Tracker

Variable	Start	After 3	After 4	After 5 (error)
currentStatus	undefined	"loading"	"success"	Error - invalid assignment

Key Moments - 2 Insights

Why does assigning "done" to currentStatus cause an error?

Because "done" is not one of the allowed string literals in the union type 'Status', as shown in execution_table step 5.

What does the type alias 'Status' represent?

It represents a union of specific string values "success", "error", and "loading", allowing variables of this type to hold only these values (execution_table step 1).

Visual Quiz - 3 Questions

Look at the execution_table at step 3, what is the value of currentStatus?

A "success"

B "loading"

C "error"

D undefined

💡 Hint

Check the 'Result' column for step 3 in execution_table.

At which step does the type error occur when assigning a value to currentStatus?

A Step 5

B Step 3

C Step 2

D Step 4

💡 Hint

Look for the 'Type error' mention in the execution_table rows.

If we add "done" to the union type alias, what changes in the execution_table?

A Step 3 assignment causes error

B Variable declaration fails

C Step 5 assignment becomes valid

D No changes

💡 Hint

Consider how the union type controls valid assignments shown in execution_table.

Concept Snapshot

Type alias for unions syntax:
type AliasName = Type1 | Type2 | ...;
Allows variables to hold any value from the union.
Assigning values outside union causes errors.
Use for clear, reusable type definitions.

Full Transcript

This example shows how to create a type alias named 'Status' that is a union of string literals "success", "error", and "loading". We declare a variable 'currentStatus' of this type. Assigning "loading" and "success" works fine because they are in the union. Assigning "done" causes a type error because it is not part of the union. This helps catch mistakes early by restricting values to a set of allowed options.