Type-safe builder pattern in Typescript - Step-by-Step Execution

Concept Flow - Type-safe builder pattern

Start Builder

↓

Set Property 1

→Check Type

| Yes↓

Set Property 2

→Check Type

| Yes↓

... More Properties

↓

Build Object

↓

Return Fully Typed Object

The builder starts empty, each property is set with type checks, and finally builds a fully typed object.

Execution Sample

Typescript

class UserBuilder {
  private name?: string;
  private age?: number;

  setName(name: string) {
    this.name = name;
    return this;
  }

  setAge(age: number) {
    this.age = age;
    return this;
  }

  build(): { name: string; age: number } {
    if (!this.name || this.age === undefined) throw new Error('Missing properties');
    return { name: this.name, age: this.age };
  }
}

const user = new UserBuilder().setName('Alice').setAge(30).build();

This code builds a user object step-by-step, ensuring name and age are set before building.

Execution Table

Step	Action	Property Set	Property Value	Return Value	Notes
1	Create UserBuilder instance	name	undefined	UserBuilder instance	Builder starts empty
2	Call setName('Alice')	name	'Alice'	UserBuilder instance	Name property set with correct type
3	Call setAge(30)	age	30	UserBuilder instance	Age property set with correct type
4	Call build()	name	'Alice'	{ name: 'Alice', age: 30 }	Build returns fully typed object
5	End	-	-	-	All required properties set, build successful

💡 Execution stops after build returns the fully typed object.

Variable Tracker

Variable	Start	After Step 2	After Step 3	After Step 4 (build)
name	undefined	'Alice'	'Alice'	'Alice'
age	undefined	undefined	30	30
user	undefined	undefined	undefined	{ name: 'Alice', age: 30 }

Key Moments - 2 Insights

Why does build() throw an error if a property is missing?

Because the build() method checks if required properties like name and age are set (see step 4 in execution_table). This ensures the final object is complete and type-safe.

Why do setName and setAge return 'this'?

Returning 'this' allows chaining multiple setter calls in one line, as shown in steps 2 and 3 of the execution_table.

Visual Quiz - 3 Questions

Look at the execution_table, what is the value of 'age' after step 2?

A 30

B undefined

C 'Alice'

D null

💡 Hint

Check the 'Property Value' column for 'age' at step 2 in execution_table.

At which step does the builder return the fully typed object?

A Step 4

B Step 3

C Step 2

D Step 1

💡 Hint

Look for the 'Return Value' column showing the final object in execution_table.

If setAge() returned void instead of 'this', how would the chaining change?

A Chaining would still work the same

B setName() would not work

C Chaining would break after setAge() call

D build() would return undefined

💡 Hint

Check how returning 'this' enables chaining in steps 2 and 3 of execution_table.

Concept Snapshot

Type-safe builder pattern in TypeScript:
- Use class with private optional properties
- Setter methods assign values and return 'this' for chaining
- build() checks all required properties are set
- build() returns fully typed object
- Ensures object is complete and type-safe before use

Full Transcript

The type-safe builder pattern in TypeScript helps create objects step-by-step while ensuring all required properties are set with correct types. We start by creating a builder instance with empty properties. Each setter method sets a property and returns the builder itself to allow chaining. When build() is called, it checks if all required properties are set; if not, it throws an error. If all properties are present, build() returns the fully typed object. This pattern prevents incomplete or wrongly typed objects from being created. The execution table shows each step: creating the builder, setting name and age, then building the final object. Variable tracking shows how properties change over time. Key moments clarify why build() checks properties and why setters return 'this'. The quiz tests understanding of property values at steps, when the object is returned, and the importance of returning 'this' for chaining.