Builder pattern with generics in Typescript - Practice Problems & Coding Challenges

Challenge - 5 Problems

❓ Predict Output

intermediate

Output of a generic builder pattern example

What is the output of this TypeScript code using a generic builder pattern?

Typescript

class Builder<T> {
  private obj: Partial<T> = {};

  set<K extends keyof T>(key: K, value: T[K]): this {
    this.obj[key] = value;
    return this;
  }

  build(): T {
    return this.obj as T;
  }
}

interface Person {
  name: string;
  age: number;
}

const person = new Builder<Person>()
  .set('name', 'Alice')
  .set('age', 30)
  .build();

console.log(person);

A SyntaxError

B {"name":"Alice"}

C {"name":"Alice","age":30}

D TypeError at runtime

💡 Hint

Look at how the generic Builder class stores and returns the object.

The Builder class collects properties in a Partial object. The set method adds keys and values. The build method casts the partial object to T and returns it. So the final object has both name and age.

❓ Predict Output

intermediate

What error occurs with missing required property?

Given this generic builder pattern code, what error occurs when a required property is missing?

Typescript

class Builder<T> {
  private obj: Partial<T> = {};

  set<K extends keyof T>(key: K, value: T[K]): this {
    this.obj[key] = value;
    return this;
  }

  build(): T {
    return this.obj as T;
  }
}

interface Car {
  make: string;
  year: number;
}

const car = new Builder<Car>()
  .set('make', 'Toyota')
  .build();

console.log(car.year.toString());

A Compile-time error in TypeScript

B SyntaxError: Missing property 'year'

C No error, outputs 'undefined'

D TypeError: Cannot read property 'toString' of undefined

💡 Hint

Check what happens when you access a property that was never set.

The build method casts a Partial to T without checking. The 'year' property is undefined at runtime. Accessing toString() on undefined causes a TypeError.

🔧 Debug

advanced

Identify the bug in this generic builder pattern

What is the bug in this TypeScript generic builder pattern code?

Typescript

class Builder<T> {
  private obj: T = {} as T;

  set<K extends keyof T>(key: K, value: T[K]): this {
    this.obj[key] = value;
    return this;
  }

  build(): T {
    return this.obj;
  }
}

interface Book {
  title: string;
  pages: number;
}

const book = new Builder<Book>()
  .set('title', 'My Book')
  .set('pages', 100)
  .build();

console.log(book);

A No error, outputs { title: 'My Book', pages: 100 }

B TypeError: Cannot assign to 'key' because 'obj' is not initialized properly

C SyntaxError: Missing colon in class property

D Runtime error: obj is undefined

💡 Hint

Check how obj is initialized and if {} is assignable to T.

The obj property is typed as T but initialized with {} which is not guaranteed to satisfy T. This causes a TypeError when assigning properties because obj is not properly initialized.

📝 Syntax

advanced

Which option correctly defines a generic builder method?

Which of these method signatures correctly defines a generic set method in a builder pattern class in TypeScript?

A set<K extends keyof T>(key: K, value: T[K]): this

B set(key: string, value: any): this

C set<K>(key: K, value: T[K]): this

D set(key: keyof T, value: any): T

💡 Hint

Look for correct generic constraints and return type.

Option A correctly uses a generic K constrained to keys of T, and the value type matches T[K]. It returns 'this' for chaining. Others have wrong types or return types.

🚀 Application

expert

How many properties does the built object have?

Consider this generic builder pattern code. How many properties does the final object have?

Typescript

class Builder<T> {
  private obj: Partial<T> = {};

  set<K extends keyof T>(key: K, value: T[K]): this {
    this.obj[key] = value;
    return this;
  }

  build(): T {
    return this.obj as T;
  }
}

interface Config {
  host: string;
  port: number;
  secure: boolean;
}

const config = new Builder<Config>()
  .set('host', 'localhost')
  .set('port', 8080)
  .build();

console.log(Object.keys(config).length);

A 2

B 3

C 0

D Runtime error

💡 Hint

Only properties set by set() exist in the object.

The builder sets only 'host' and 'port'. The 'secure' property is missing, so Object.keys returns 2 keys.