Mastering Behavioral Design Patterns: My Journey from Chaotic Object Communication to Elegant Interactions

Personal Knowledge Sharing: How I learned to build more maintainable, flexible systems using behavioral design patterns

After years of wrestling with complex object interactions, tangled communication flows, and rigid system behaviors in my personal development projects, I discovered that behavioral design patterns were the key to writing elegant, maintainable code. These patterns taught me how to design systems where objects communicate effectively and responsibilities are clearly defined. In this comprehensive guide, I'll share my journey through all eleven behavioral patterns—Observer, Strategy, Command, State, Template Method, Chain of Responsibility, Mediator, Memento, Visitor, Iterator, and Interpreter—with practical examples from my own development projects.

What Are Behavioral Design Patterns?

Behavioral patterns focus on communication between objects and the assignment of responsibilities between them. They help define how objects interact and collaborate, making systems more flexible and easier to maintain.

These patterns solve problems related to:

• Object communication and coordination

• Algorithm encapsulation and variation

• State management and transitions

• Request handling and processing

• Iteration and traversal

Why Behavioral Patterns Matter in My Development Projects

In my personal coding journey, behavioral patterns have become increasingly valuable because they:

1. Decouple Objects: Reduce tight coupling between communicating objects in my projects

2. Enable Flexibility: Make it easy to change behaviors at runtime as my projects evolve

3. Improve Testability: Isolate behaviors for easier unit testing in my test-driven development

4. Handle Complexity: Manage complex state machines and workflows in my applications

5. Promote Reusability: Create reusable behavioral components across my different projects

Let's explore each major behavioral pattern and how I've applied them in my personal development projects.

---

1. Observer Pattern: The "Event Notification System"

My Personal Project Experience

I first encountered the Observer pattern when building a stock market dashboard for a personal project. Multiple UI components needed to update when stock prices changed, and I was initially using direct callbacks everywhere. The Observer pattern cleaned this up beautifully.

The Problem It Solves

• Defines a one-to-many dependency between objects

• Notifies multiple dependents when an object changes state

• Maintains loose coupling between subjects and observers

TypeScript Implementation

// Observer interface
interface Observer {
  update(data: any): void;
}

// Subject interface
interface Subject {
  subscribe(observer: Observer): void;
  unsubscribe(observer: Observer): void;
  notify(data: any): void;
}

// Concrete Subject
class StockPriceTracker implements Subject {
  private observers: Observer[] = [];
  private stockPrices: Map<string, number> = new Map();

  subscribe(observer: Observer): void {
    this.observers.push(observer);
  }

  unsubscribe(observer: Observer): void {
    this.observers = this.observers.filter(obs => obs !== observer);
  }

  notify(data: any): void {
    this.observers.forEach(observer => observer.update(data));
  }

  updatePrice(symbol: string, price: number): void {
    this.stockPrices.set(symbol, price);
    this.notify({ symbol, price, timestamp: Date.now() });
  }
}

// Concrete Observers
class DashboardComponent implements Observer {
  update(data: any): void {
    console.log(`Dashboard: ${data.symbol} price updated to $${data.price}`);
    // Update dashboard UI
  }
}

class AlertService implements Observer {
  private thresholds: Map<string, number> = new Map();

  setThreshold(symbol: string, threshold: number): void {
    this.thresholds.set(symbol, threshold);
  }

  update(data: any): void {
    const threshold = this.thresholds.get(data.symbol);
    if (threshold && data.price > threshold) {
      console.log(`ALERT: ${data.symbol} exceeded threshold! Price: $${data.price}`);
    }
  }
}

// Usage
const priceTracker = new StockPriceTracker();
const dashboard = new DashboardComponent();
const alertService = new AlertService();

priceTracker.subscribe(dashboard);
priceTracker.subscribe(alertService);

alertService.setThreshold('AAPL', 150);
priceTracker.updatePrice('AAPL', 155); // Both observers get notified

When I Use It

• Event-driven architectures

• Model-View architectures

• Real-time data updates

• Notification systems

---

2. Strategy Pattern: The "Algorithm Switcher"

My Development Journey

While building a payment processing module for a personal e-commerce project, I needed to handle multiple payment methods (credit card, PayPal, bank transfer) with different processing logic. Initially, I used if/else statements everywhere. The Strategy pattern made this much more maintainable.

The Problem It Solves

• Defines a family of algorithms and makes them interchangeable

• Encapsulates algorithms and makes them independent of clients

• Enables algorithm selection at runtime

TypeScript Implementation

// Strategy interface
interface PaymentStrategy {
  processPayment(amount: number): Promise<boolean>;
  validatePayment(paymentData: any): boolean;
}

// Concrete Strategies
class CreditCardStrategy implements PaymentStrategy {
  constructor(
    private cardNumber: string,
    private cvv: string,
    private expiryDate: string
  ) {}

  validatePayment(paymentData: any): boolean {
    // Credit card validation logic
    return this.cardNumber.length === 16 && this.cvv.length === 3;
  }

  async processPayment(amount: number): Promise<boolean> {
    console.log(`Processing $${amount} via Credit Card ending in ${this.cardNumber.slice(-4)}`);
    // Simulate API call to payment processor
    return new Promise(resolve => setTimeout(() => resolve(true), 1000));
  }
}

class PayPalStrategy implements PaymentStrategy {
  constructor(private email: string, private password: string) {}

  validatePayment(paymentData: any): boolean {
    // PayPal validation logic
    return this.email.includes('@') && this.password.length >= 8;
  }

  async processPayment(amount: number): Promise<boolean> {
    console.log(`Processing $${amount} via PayPal for ${this.email}`);
    // Simulate PayPal API call
    return new Promise(resolve => setTimeout(() => resolve(true), 1500));
  }
}

class BankTransferStrategy implements PaymentStrategy {
  constructor(
    private accountNumber: string,
    private routingNumber: string
  ) {}

  validatePayment(paymentData: any): boolean {
    return this.accountNumber.length >= 8 && this.routingNumber.length === 9;
  }

  async processPayment(amount: number): Promise<boolean> {
    console.log(`Processing $${amount} via Bank Transfer to account ${this.accountNumber}`);
    // Simulate bank API call
    return new Promise(resolve => setTimeout(() => resolve(true), 2000));
  }
}

// Context
class PaymentProcessor {
  private strategy: PaymentStrategy;

  constructor(strategy: PaymentStrategy) {
    this.strategy = strategy;
  }

  setStrategy(strategy: PaymentStrategy): void {
    this.strategy = strategy;
  }

  async executePayment(amount: number, paymentData: any): Promise<boolean> {
    if (!this.strategy.validatePayment(paymentData)) {
      throw new Error('Invalid payment data');
    }
    return await this.strategy.processPayment(amount);
  }
}

// Usage
const processor = new PaymentProcessor(
  new CreditCardStrategy('1234567890123456', '123', '12/25')
);

// Process with credit card
await processor.executePayment(100, {});

// Switch to PayPal
processor.setStrategy(new PayPalStrategy('[email protected]', 'password123'));
await processor.executePayment(200, {});

When I Use It

• Multiple algorithms for the same problem

• Runtime algorithm selection

• Eliminating conditional statements

• A/B testing different approaches

---

3. Command Pattern: The "Action Encapsulator"

My Development Challenge

When building a text editor for my portfolio projects, I needed to implement undo/redo functionality. The Command pattern was perfect for encapsulating each action as an object that could be executed, undone, and stored in history.

The Problem It Solves

• Encapsulates requests as objects

• Allows parameterization of clients with different requests

• Supports undo operations and logging

TypeScript Implementation

// Command interface
interface Command {
  execute(): void;
  undo(): void;
  getDescription(): string;
}

// Receiver
class TextEditor {
  private content: string = '';

  getContent(): string {
    return this.content;
  }

  insertText(text: string, position: number): void {
    this.content = this.content.slice(0, position) + text + this.content.slice(position);
  }

  deleteText(startPosition: number, length: number): void {
    this.content = this.content.slice(0, startPosition) + 
                  this.content.slice(startPosition + length);
  }

  replaceText(startPosition: number, length: number, newText: string): void {
    this.content = this.content.slice(0, startPosition) + 
                  newText + 
                  this.content.slice(startPosition + length);
  }
}

// Concrete Commands
class InsertTextCommand implements Command {
  constructor(
    private editor: TextEditor,
    private text: string,
    private position: number
  ) {}

  execute(): void {
    this.editor.insertText(this.text, this.position);
  }

  undo(): void {
    this.editor.deleteText(this.position, this.text.length);
  }

  getDescription(): string {
    return `Insert "${this.text}" at position ${this.position}`;
  }
}

class DeleteTextCommand implements Command {
  private deletedText: string = '';

  constructor(
    private editor: TextEditor,
    private startPosition: number,
    private length: number
  ) {}

  execute(): void {
    // Store deleted text for undo
    this.deletedText = this.editor.getContent().slice(
      this.startPosition, 
      this.startPosition + this.length
    );
    this.editor.deleteText(this.startPosition, this.length);
  }

  undo(): void {
    this.editor.insertText(this.deletedText, this.startPosition);
  }

  getDescription(): string {
    return `Delete ${this.length} characters from position ${this.startPosition}`;
  }
}

// Invoker
class EditorInvoker {
  private history: Command[] = [];
  private currentPosition: number = -1;

  executeCommand(command: Command): void {
    // Remove any commands after current position (when user does something after undo)
    this.history = this.history.slice(0, this.currentPosition + 1);
    
    command.execute();
    this.history.push(command);
    this.currentPosition++;
    
    console.log(`Executed: ${command.getDescription()}`);
  }

  undo(): void {
    if (this.currentPosition >= 0) {
      const command = this.history[this.currentPosition];
      command.undo();
      this.currentPosition--;
      console.log(`Undid: ${command.getDescription()}`);
    }
  }

  redo(): void {
    if (this.currentPosition < this.history.length - 1) {
      this.currentPosition++;
      const command = this.history[this.currentPosition];
      command.execute();
      console.log(`Redid: ${command.getDescription()}`);
    }
  }

  getHistory(): string[] {
    return this.history.map(cmd => cmd.getDescription());
  }
}

// Usage
const editor = new TextEditor();
const invoker = new EditorInvoker();

// Execute commands
invoker.executeCommand(new InsertTextCommand(editor, 'Hello', 0));
invoker.executeCommand(new InsertTextCommand(editor, ' World', 5));
invoker.executeCommand(new DeleteTextCommand(editor, 5, 6));

console.log('Current content:', editor.getContent()); // "Hello"

// Undo operations
invoker.undo(); // Undo delete
console.log('After undo:', editor.getContent()); // "Hello World"

invoker.undo(); // Undo second insert
console.log('After undo:', editor.getContent()); // "Hello"

// Redo
invoker.redo();
console.log('After redo:', editor.getContent()); // "Hello World"

When I Use It

• Implementing undo/redo functionality

• Queuing and logging operations

• Macro recording and playback

• Decoupling request senders from receivers

---

4. State Pattern: The "Behavior Changer"

My Development Journey

During a personal e-commerce project, I created an order tracking module where orders went through multiple states (pending, confirmed, shipped, delivered, cancelled). Initially, I used flags and if statements, but it became unmaintainable. The State pattern was a game-changer.

The Problem It Solves

• Allows an object to alter its behavior when internal state changes

• Localizes state-specific behavior and partitions behavior for different states

• Makes state transitions explicit

TypeScript Implementation

// State interface
interface OrderState {
  confirm(order: Order): void;
  ship(order: Order): void;
  deliver(order: Order): void;
  cancel(order: Order): void;
  getStatus(): string;
}

// Context
class Order {
  private state: OrderState;
  private items: string[] = [];
  private total: number = 0;

  constructor(items: string[], total: number) {
    this.items = items;
    this.total = total;
    this.state = new PendingState(); // Initial state
  }

  setState(state: OrderState): void {
    this.state = state;
    console.log(`Order state changed to: ${this.state.getStatus()}`);
  }

  confirm(): void {
    this.state.confirm(this);
  }

  ship(): void {
    this.state.ship(this);
  }

  deliver(): void {
    this.state.deliver(this);
  }

  cancel(): void {
    this.state.cancel(this);
  }

  getStatus(): string {
    return this.state.getStatus();
  }

  getOrderDetails(): { items: string[], total: number } {
    return { items: [...this.items], total: this.total };
  }
}

// Concrete States
class PendingState implements OrderState {
  confirm(order: Order): void {
    console.log('Order confirmed. Processing payment...');
    order.setState(new ConfirmedState());
  }

  ship(order: Order): void {
    console.log('Cannot ship order. Order must be confirmed first.');
  }

  deliver(order: Order): void {
    console.log('Cannot deliver order. Order must be shipped first.');
  }

  cancel(order: Order): void {
    console.log('Order cancelled.');
    order.setState(new CancelledState());
  }

  getStatus(): string {
    return 'Pending';
  }
}

class ConfirmedState implements OrderState {
  confirm(order: Order): void {
    console.log('Order is already confirmed.');
  }

  ship(order: Order): void {
    console.log('Order shipped. Tracking information sent.');
    order.setState(new ShippedState());
  }

  deliver(order: Order): void {
    console.log('Cannot deliver order. Order must be shipped first.');
  }

  cancel(order: Order): void {
    console.log('Order cancelled. Refunding payment...');
    order.setState(new CancelledState());
  }

  getStatus(): string {
    return 'Confirmed';
  }
}

class ShippedState implements OrderState {
  confirm(order: Order): void {
    console.log('Order is already confirmed and shipped.');
  }

  ship(order: Order): void {
    console.log('Order is already shipped.');
  }

  deliver(order: Order): void {
    console.log('Order delivered successfully!');
    order.setState(new DeliveredState());
  }

  cancel(order: Order): void {
    console.log('Cannot cancel order. Order has already shipped.');
  }

  getStatus(): string {
    return 'Shipped';
  }
}

class DeliveredState implements OrderState {
  confirm(order: Order): void {
    console.log('Order is already delivered.');
  }

  ship(order: Order): void {
    console.log('Order is already delivered.');
  }

  deliver(order: Order): void {
    console.log('Order is already delivered.');
  }

  cancel(order: Order): void {
    console.log('Cannot cancel delivered order.');
  }

  getStatus(): string {
    return 'Delivered';
  }
}

class CancelledState implements OrderState {
  confirm(order: Order): void {
    console.log('Cannot confirm cancelled order.');
  }

  ship(order: Order): void {
    console.log('Cannot ship cancelled order.');
  }

  deliver(order: Order): void {
    console.log('Cannot deliver cancelled order.');
  }

  cancel(order: Order): void {
    console.log('Order is already cancelled.');
  }

  getStatus(): string {
    return 'Cancelled';
  }
}

// Usage
const order = new Order(['Laptop', 'Mouse'], 1299.99);

console.log('Initial status:', order.getStatus()); // Pending

order.confirm(); // State: Confirmed
order.ship();    // State: Shipped
order.deliver(); // State: Delivered

// Try to cancel delivered order
order.cancel(); // "Cannot cancel delivered order."

When I Use It

• Complex state machines

• Objects that change behavior based on state

• Workflow systems

• Game character behaviors

---

5. Template Method Pattern: The "Algorithm Framework"

My Side Project Experience

When building a code generator tool for my development workflow that could create different types of files (TypeScript, Python, Java), I noticed each generator followed the same steps but with different implementations. The Template Method pattern was perfect for this.

The Problem It Solves

• Defines the skeleton of an algorithm in a base class

• Lets subclasses override specific steps without changing structure

• Promotes code reuse and consistency

TypeScript Implementation

// Abstract Template
abstract class CodeGenerator {
  // Template method
  public generateCode(className: string, properties: Property[]): string {
    let code = '';
    
    code += this.generateFileHeader();
    code += this.generateImports();
    code += this.generateClassDeclaration(className);
    code += this.generateProperties(properties);
    code += this.generateConstructor(className, properties);
    code += this.generateMethods(properties);
    code += this.generateClassClosing();
    code += this.generateFileFooter();
    
    return code;
  }

  // Abstract methods (must be implemented by subclasses)
  protected abstract generateFileHeader(): string;
  protected abstract generateImports(): string;
  protected abstract generateClassDeclaration(className: string): string;
  protected abstract generateProperties(properties: Property[]): string;
  protected abstract generateConstructor(className: string, properties: Property[]): string;
  protected abstract generateMethods(properties: Property[]): string;
  protected abstract generateClassClosing(): string;

  // Hook method (optional override)
  protected generateFileFooter(): string {
    return ''; // Default empty implementation
  }
}

interface Property {
  name: string;
  type: string;
  isRequired: boolean;
}

// Concrete Implementation - TypeScript
class TypeScriptGenerator extends CodeGenerator {
  protected generateFileHeader(): string {
    return `// Generated TypeScript class\n// Generated on: ${new Date().toISOString()}\n\n`;
  }

  protected generateImports(): string {
    return `// Add your imports here\n\n`;
  }

  protected generateClassDeclaration(className: string): string {
    return `export class ${className} {\n`;
  }

  protected generateProperties(properties: Property[]): string {
    let code = '';
    properties.forEach(prop => {
      const optional = prop.isRequired ? '' : '?';
      code += `  private ${prop.name}${optional}: ${prop.type};\n`;
    });
    return code + '\n';
  }

  protected generateConstructor(className: string, properties: Property[]): string {
    const params = properties
      .map(p => `${p.name}${p.isRequired ? '' : '?'}: ${p.type}`)
      .join(', ');
    
    let code = `  constructor(${params}) {\n`;
    properties.forEach(prop => {
      if (prop.isRequired) {
        code += `    this.${prop.name} = ${prop.name};\n`;
      } else {
        code += `    if (${prop.name} !== undefined) {\n`;
        code += `      this.${prop.name} = ${prop.name};\n`;
        code += `    }\n`;
      }
    });
    code += `  }\n\n`;
    return code;
  }

  protected generateMethods(properties: Property[]): string {
    let code = '';
    properties.forEach(prop => {
      const capitalizedName = prop.name.charAt(0).toUpperCase() + prop.name.slice(1);
      
      // Getter
      code += `  public get${capitalizedName}(): ${prop.type} {\n`;
      code += `    return this.${prop.name};\n`;
      code += `  }\n\n`;
      
      // Setter
      code += `  public set${capitalizedName}(value: ${prop.type}): void {\n`;
      code += `    this.${prop.name} = value;\n`;
      code += `  }\n\n`;
    });
    return code;
  }

  protected generateClassClosing(): string {
    return `}\n`;
  }
}

// Concrete Implementation - Python
class PythonGenerator extends CodeGenerator {
  protected generateFileHeader(): string {
    return `"""Generated Python class\nGenerated on: ${new Date().toISOString()}\n"""\n\n`;
  }

  protected generateImports(): string {
    return `from typing import Optional\n\n`;
  }

  protected generateClassDeclaration(className: string): string {
    return `class ${className}:\n`;
  }

  protected generateProperties(properties: Property[]): string {
    // Python uses __init__ for properties, so we return empty here
    return '';
  }

  protected generateConstructor(className: string, properties: Property[]): string {
    const params = properties
      .map(p => `${p.name}: ${p.isRequired ? p.type : `Optional[${p.type}] = None`}`)
      .join(', ');
    
    let code = `    def __init__(self, ${params}):\n`;
    properties.forEach(prop => {
      code += `        self.${prop.name} = ${prop.name}\n`;
    });
    code += '\n';
    return code;
  }

  protected generateMethods(properties: Property[]): string {
    let code = '';
    properties.forEach(prop => {
      // Property decorator (Python style getter/setter)
      code += `    @property\n`;
      code += `    def ${prop.name}(self) -> ${prop.type}:\n`;
      code += `        return self._${prop.name}\n\n`;
      
      code += `    @${prop.name}.setter\n`;
      code += `    def ${prop.name}(self, value: ${prop.type}) -> None:\n`;
      code += `        self._${prop.name} = value\n\n`;
    });
    return code;
  }

  protected generateClassClosing(): string {
    return '';
  }

  protected generateFileFooter(): string {
    return '\n# End of generated class\n';
  }
}

// Usage
const properties: Property[] = [
  { name: 'id', type: 'number', isRequired: true },
  { name: 'name', type: 'string', isRequired: true },
  { name: 'email', type: 'string', isRequired: false }
];

const tsGenerator = new TypeScriptGenerator();
const pyGenerator = new PythonGenerator();

console.log('=== TypeScript Code ===');
console.log(tsGenerator.generateCode('User', properties));

console.log('\n=== Python Code ===');
console.log(pyGenerator.generateCode('User', properties));

When I Use It

• Code generation systems

• Data processing pipelines

• Testing frameworks

• Build systems

---

6. Chain of Responsibility Pattern: The "Request Router"

My Backend Development Challenge

When building an API service for my portfolio application, I needed to process requests through multiple handlers (authentication, validation, logging, rate limiting). The Chain of Responsibility pattern created a clean, extensible pipeline.

The Problem It Solves

• Passes requests along a chain of handlers

• Decouples request senders from receivers

• Allows dynamic chain modification

TypeScript Implementation

// Handler interface
interface RequestHandler {
  setNext(handler: RequestHandler): RequestHandler;
  handle(request: ApiRequest): Promise<ApiResponse | null>;
}

// Base handler
abstract class BaseRequestHandler implements RequestHandler {
  private nextHandler: RequestHandler | null = null;

  public setNext(handler: RequestHandler): RequestHandler {
    this.nextHandler = handler;
    return handler;
  }

  public async handle(request: ApiRequest): Promise<ApiResponse | null> {
    const result = await this.process(request);
    
    if (result) {
      return result; // Request handled, stop chain
    }
    
    if (this.nextHandler) {
      return await this.nextHandler.handle(request);
    }
    
    return null; // No handler could process the request
  }

  protected abstract process(request: ApiRequest): Promise<ApiResponse | null>;
}

interface ApiRequest {
  id: string;
  method: string;
  path: string;
  headers: Record<string, string>;
  body: any;
  timestamp: number;
  clientIp: string;
}

interface ApiResponse {
  statusCode: number;
  body: any;
  headers?: Record<string, string>;
}

// Concrete Handlers
class AuthenticationHandler extends BaseRequestHandler {
  protected async process(request: ApiRequest): Promise<ApiResponse | null> {
    const authHeader = request.headers['Authorization'];
    
    if (!authHeader || !authHeader.startsWith('Bearer ')) {
      return {
        statusCode: 401,
        body: { error: 'Authentication required' }
      };
    }
    
    const token = authHeader.substring(7);
    
    // Simulate token validation
    if (token === 'invalid-token') {
      return {
        statusCode: 401,
        body: { error: 'Invalid token' }
      };
    }
    
    console.log(`✓ Authentication passed for request ${request.id}`);
    return null; // Continue to next handler
  }
}

class RateLimitHandler extends BaseRequestHandler {
  private requestCounts: Map<string, { count: number, resetTime: number }> = new Map();
  private readonly limit = 100; // requests per hour
  private readonly windowMs = 60 * 60 * 1000; // 1 hour

  protected async process(request: ApiRequest): Promise<ApiResponse | null> {
    const clientKey = request.clientIp;
    const now = Date.now();
    
    let clientData = this.requestCounts.get(clientKey);
    
    if (!clientData || now > clientData.resetTime) {
      clientData = { count: 0, resetTime: now + this.windowMs };
    }
    
    clientData.count++;
    this.requestCounts.set(clientKey, clientData);
    
    if (clientData.count > this.limit) {
      return {
        statusCode: 429,
        body: { error: 'Rate limit exceeded' },
        headers: {
          'Retry-After': Math.ceil((clientData.resetTime - now) / 1000).toString()
        }
      };
    }
    
    console.log(`✓ Rate limit check passed for ${clientKey} (${clientData.count}/${this.limit})`);
    return null; // Continue to next handler
  }
}

class ValidationHandler extends BaseRequestHandler {
  protected async process(request: ApiRequest): Promise<ApiResponse | null> {
    // Validate request structure
    if (!request.method || !request.path) {
      return {
        statusCode: 400,
        body: { error: 'Invalid request format' }
      };
    }
    
    // Validate specific endpoints
    if (request.method === 'POST' && request.path === '/users') {
      if (!request.body || !request.body.name || !request.body.email) {
        return {
          statusCode: 400,
          body: { error: 'Missing required fields: name, email' }
        };
      }
    }
    
    console.log(`✓ Validation passed for ${request.method} ${request.path}`);
    return null; // Continue to next handler
  }
}

class LoggingHandler extends BaseRequestHandler {
  protected async process(request: ApiRequest): Promise<ApiResponse | null> {
    console.log(`📝 Logging: ${request.method} ${request.path} from ${request.clientIp}`);
    
    // Log to external service (simulated)
    this.logToExternalService(request);
    
    return null; // Always continue to next handler
  }
  
  private logToExternalService(request: ApiRequest): void {
    // Simulate logging to external service
    setTimeout(() => {
      console.log(`   Logged request ${request.id} to external service`);
    }, 100);
  }
}

class BusinessLogicHandler extends BaseRequestHandler {
  protected async process(request: ApiRequest): Promise<ApiResponse | null> {
    console.log(`🚀 Processing business logic for ${request.method} ${request.path}`);
    
    // Simulate business logic processing
    if (request.path === '/users' && request.method === 'GET') {
      return {
        statusCode: 200,
        body: { users: ['John', 'Jane', 'Bob'] }
      };
    }
    
    if (request.path === '/users' && request.method === 'POST') {
      return {
        statusCode: 201,
        body: { 
          message: 'User created', 
          user: { id: Date.now(), ...request.body } 
        }
      };
    }
    
    return {
      statusCode: 404,
      body: { error: 'Endpoint not found' }
    };
  }
}

// API Gateway using Chain of Responsibility
class ApiGateway {
  private handlerChain: RequestHandler;

  constructor() {
    // Build the chain
    const auth = new AuthenticationHandler();
    const rateLimit = new RateLimitHandler();
    const validation = new ValidationHandler();
    const logging = new LoggingHandler();
    const businessLogic = new BusinessLogicHandler();

    // Chain them together
    this.handlerChain = auth;
    auth.setNext(rateLimit)
        .setNext(validation)
        .setNext(logging)
        .setNext(businessLogic);
  }

  public async processRequest(request: ApiRequest): Promise<ApiResponse> {
    console.log(`\n🔄 Processing request ${request.id}: ${request.method} ${request.path}`);
    
    const response = await this.handlerChain.handle(request);
    
    if (!response) {
      return {
        statusCode: 500,
        body: { error: 'No handler could process the request' }
      };
    }
    
    console.log(`✅ Request ${request.id} completed with status ${response.statusCode}`);
    return response;
  }
}

// Usage
const gateway = new ApiGateway();

// Test requests
const validRequest: ApiRequest = {
  id: '1',
  method: 'GET',
  path: '/users',
  headers: { 'Authorization': 'Bearer valid-token' },
  body: null,
  timestamp: Date.now(),
  clientIp: '192.168.1.1'
};

const invalidAuthRequest: ApiRequest = {
  id: '2',
  method: 'POST',
  path: '/users',
  headers: { 'Authorization': 'Bearer invalid-token' },
  body: { name: 'John', email: '[email protected]' },
  timestamp: Date.now(),
  clientIp: '192.168.1.2'
};

// Process requests
gateway.processRequest(validRequest);
gateway.processRequest(invalidAuthRequest);

When I Use It

• Request processing pipelines

• Middleware systems

• Event handling chains

• Approval workflows

---

7. Mediator Pattern: The "Communication Hub"

My Personal Project Challenge

When developing a messaging application for my portfolio, I struggled with direct communication between user interfaces, chat rooms, and notification systems. Objects were tightly coupled with references to each other everywhere. The Mediator pattern helped me centralize these communications.

The Problem It Solves

• Reduces coupling between components by introducing a mediator object

• Centralizes complex communication logic

• Simplifies maintenance by isolating interaction changes

TypeScript Implementation

// Mediator interface
interface ChatMediator {
  sendMessage(message: string, user: User): void;
  registerUser(user: User): void;
  removeUser(user: User): void;
}

// Concrete Mediator
class ChatRoom implements ChatMediator {
  private users: User[] = [];
  
  registerUser(user: User): void {
    this.users.push(user);
    user.setMediator(this);
    console.log(`${user.getName()} joined the chat room`);
  }
  
  removeUser(user: User): void {
    const index = this.users.findIndex(u => u === user);
    if (index !== -1) {
      this.users.splice(index, 1);
      console.log(`${user.getName()} left the chat room`);
    }
  }
  
  sendMessage(message: string, sender: User): void {
    console.log(`[${new Date().toLocaleTimeString()}] ${sender.getName()}: ${message}`);
    
    // Send message to all users except the sender
    this.users.forEach(user => {
      if (user !== sender) {
        user.receiveMessage(message, sender.getName());
      }
    });
    
    // If message contains certain keywords, notify admin
    if (message.toLowerCase().includes('help') || message.toLowerCase().includes('admin')) {
      this.notifyAdmin(message, sender.getName());
    }
  }
  
  private notifyAdmin(message: string, sender: string): void {
    console.log(`ADMIN NOTIFICATION: User ${sender} may need assistance: "${message}"`);
  }
}

// Colleague interface/abstract class
abstract class User {
  protected mediator: ChatMediator | null = null;
  protected name: string;
  
  constructor(name: string) {
    this.name = name;
  }
  
  setMediator(mediator: ChatMediator): void {
    this.mediator = mediator;
  }
  
  getName(): string {
    return this.name;
  }
  
  send(message: string): void {
    if (this.mediator) {
      console.log(`${this.name} is sending: ${message}`);
      this.mediator.sendMessage(message, this);
    }
  }
  
  abstract receiveMessage(message: string, sender: string): void;
}

// Concrete Colleagues
class RegularUser extends User {
  receiveMessage(message: string, sender: string): void {
    console.log(`${this.name} received from ${sender}: ${message}`);
  }
}

class PremiumUser extends User {
  receiveMessage(message: string, sender: string): void {
    // Premium users get messages with timestamps
    console.log(`${this.name} received message at ${new Date().toLocaleTimeString()} from ${sender}: ${message}`);
  }
  
  // Premium users can send broadcast messages
  broadcast(message: string): void {
    if (this.mediator) {
      const broadcastMsg = `[BROADCAST] ${message}`;
      this.mediator.sendMessage(broadcastMsg, this);
    }
  }
}

// Usage
const chatRoom = new ChatRoom();
const john = new RegularUser('John');
const alice = new PremiumUser('Alice');
const bob = new RegularUser('Bob');

chatRoom.registerUser(john);
chatRoom.registerUser(alice);
chatRoom.registerUser(bob);

john.send("Hello everyone!");
alice.send("Hi John, how are you?");
bob.send("Can someone help me with the new features?");
alice.broadcast("Remember to join our virtual meetup tomorrow!");

How Mediator Pattern Communication Works: Sequence Diagram

When I Use It

• Complex communication between objects

• Reducing dependencies between classes

• Chat applications and messaging systems

• Air traffic control systems

---

8. Memento Pattern: The "Time Machine"

My Development Problem

During the development of a diagram editor for a personal project, I needed to implement the ability to undo multiple actions. Direct access to object states created tight coupling, and deep copying was inefficient. The Memento pattern elegantly solved this problem.

The Problem It Solves

• Captures and externalizes an object's internal state

• Allows restoring objects to previous states

• Maintains encapsulation boundaries

TypeScript Implementation

// Memento
class DiagramMemento {
  private state: string;
  private timestamp: Date;
  
  constructor(state: string) {
    this.state = state;
    this.timestamp = new Date();
  }
  
  getState(): string {
    return this.state;
  }
  
  getTimestamp(): Date {
    return this.timestamp;
  }
  
  getMetadata(): string {
    return `Saved at ${this.timestamp.toLocaleTimeString()} - Elements: ${
      JSON.parse(this.state).elements.length
    }`;
  }
}

// Originator
class DiagramEditor {
  private elements: Array<{id: string, type: string, x: number, y: number, data: any}> = [];
  private selectedId: string | null = null;
  
  addElement(type: string, x: number, y: number, data: any): string {
    const id = `element_${Date.now()}`;
    this.elements.push({ id, type, x, y, data });
    console.log(`Added ${type} element at position (${x}, ${y})`);
    return id;
  }
  
  moveElement(id: string, newX: number, newY: number): void {
    const element = this.elements.find(e => e.id === id);
    if (element) {
      console.log(`Moving element ${id} from (${element.x}, ${element.y}) to (${newX}, ${newY})`);
      element.x = newX;
      element.y = newY;
    }
  }
  
  deleteElement(id: string): void {
    const index = this.elements.findIndex(e => e.id === id);
    if (index !== -1) {
      console.log(`Deleted element ${id} (${this.elements[index].type})`);
      this.elements.splice(index, 1);
    }
  }
  
  selectElement(id: string): void {
    this.selectedId = id;
    console.log(`Selected element ${id}`);
  }
  
  getCurrentState(): string {
    return JSON.stringify({
      elements: this.elements,
      selectedId: this.selectedId
    });
  }
  
  save(): DiagramMemento {
    console.log('Saving current diagram state');
    return new DiagramMemento(this.getCurrentState());
  }
  
  restore(memento: DiagramMemento): void {
    const state = JSON.parse(memento.getState());
    this.elements = state.elements;
    this.selectedId = state.selectedId;
    console.log(`Restored diagram state from ${memento.getTimestamp().toLocaleTimeString()}`);
  }
  
  printDiagramState(): void {
    console.log('Current diagram state:');
    console.log(`Elements: ${this.elements.length}`);
    this.elements.forEach(e => {
      console.log(`- ${e.type} at (${e.x}, ${e.y})`);
    });
    console.log(`Selected: ${this.selectedId || 'none'}`);
  }
}

// Caretaker
class History {
  private mementos: DiagramMemento[] = [];
  private currentIndex: number = -1;
  
  push(memento: DiagramMemento): void {
    // When adding a new state, remove any future history (if we've gone back and then made changes)
    if (this.currentIndex < this.mementos.length - 1) {
      this.mementos = this.mementos.slice(0, this.currentIndex + 1);
    }
    
    this.mementos.push(memento);
    this.currentIndex = this.mementos.length - 1;
    console.log(`Saved to history. Total states: ${this.mementos.length}`);
  }
  
  undo(editor: DiagramEditor): boolean {
    if (this.currentIndex > 0) {
      this.currentIndex--;
      editor.restore(this.mementos[this.currentIndex]);
      return true;
    }
    console.log('Nothing to undo');
    return false;
  }
  
  redo(editor: DiagramEditor): boolean {
    if (this.currentIndex < this.mementos.length - 1) {
      this.currentIndex++;
      editor.restore(this.mementos[this.currentIndex]);
      return true;
    }
    console.log('Nothing to redo');
    return false;
  }
  
  getHistory(): string[] {
    return this.mementos.map((m, i) => {
      return `${i === this.currentIndex ? '➤ ' : '  '}${m.getMetadata()}`;
    });
  }
}

// Usage
const editor = new DiagramEditor();
const history = new History();

// Initial state
history.push(editor.save());

// User actions with history tracking
const rect1 = editor.addElement('rectangle', 10, 10, { width: 100, height: 50 });
history.push(editor.save());

const circle1 = editor.addElement('circle', 150, 30, { radius: 25 });
history.push(editor.save());

editor.moveElement(rect1, 20, 20);
history.push(editor.save());

editor.selectElement(circle1);
history.push(editor.save());

// View current state
editor.printDiagramState();
console.log('History states:');
console.log(history.getHistory());

// Undo operations
console.log('\nUndoing last action...');
history.undo(editor);
editor.printDiagramState();

console.log('\nUndoing another action...');
history.undo(editor);
editor.printDiagramState();

// Redo operation
console.log('\nRedoing action...');
history.redo(editor);
editor.printDiagramState();

How Memento Pattern Works: Sequence Diagram

When I Use It

• Undo/redo functionality

• Saving snapshots of object states

• Transaction rollback mechanisms

• Versioning systems

---

9. Visitor Pattern: The "Operation Injector"

My Design Challenge

When building a document editor for a personal writing project, I had a complex hierarchy of different node types (text, image, table, etc.). Adding new operations meant modifying every node class. The Visitor pattern let me add new operations without changing the node classes.

The Problem It Solves

• Separates algorithms from the objects they operate on

• Enables adding new operations without modifying existing classes

• Works well with complex object structures

TypeScript Implementation

// Visitor interfaces
interface DocumentVisitor {
  visitText(element: TextElement): void;
  visitImage(element: ImageElement): void;
  visitTable(element: TableElement): void;
  visitLink(element: LinkElement): void;
  getResult(): any;
}

// Element interfaces
interface DocumentElement {
  accept(visitor: DocumentVisitor): void;
  getContent(): string;
  getAttributes(): Record<string, any>;
}

// Concrete Elements
class TextElement implements DocumentElement {
  private content: string;
  private attributes: Record<string, any>;
  
  constructor(content: string, attributes: Record<string, any> = {}) {
    this.content = content;
    this.attributes = { ...attributes, type: 'text' };
  }
  
  accept(visitor: DocumentVisitor): void {
    visitor.visitText(this);
  }
  
  getContent(): string {
    return this.content;
  }
  
  getAttributes(): Record<string, any> {
    return this.attributes;
  }
}

class ImageElement implements DocumentElement {
  private src: string;
  private alt: string;
  private attributes: Record<string, any>;
  
  constructor(src: string, alt: string, attributes: Record<string, any> = {}) {
    this.src = src;
    this.alt = alt;
    this.attributes = { ...attributes, type: 'image', src, alt };
  }
  
  accept(visitor: DocumentVisitor): void {
    visitor.visitImage(this);
  }
  
  getContent(): string {
    return this.src;
  }
  
  getAttributes(): Record<string, any> {
    return this.attributes;
  }
}

class TableElement implements DocumentElement {
  private data: string[][];
  private attributes: Record<string, any>;
  
  constructor(data: string[][], attributes: Record<string, any> = {}) {
    this.data = data;
    this.attributes = { ...attributes, type: 'table' };
  }
  
  accept(visitor: DocumentVisitor): void {
    visitor.visitTable(this);
  }
  
  getContent(): string {
    return JSON.stringify(this.data);
  }
  
  getAttributes(): Record<string, any> {
    return this.attributes;
  }
  
  getData(): string[][] {
    return this.data;
  }
}

class LinkElement implements DocumentElement {
  private text: string;
  private href: string;
  private attributes: Record<string, any>;
  
  constructor(text: string, href: string, attributes: Record<string, any> = {}) {
    this.text = text;
    this.href = href;
    this.attributes = { ...attributes, type: 'link', href };
  }
  
  accept(visitor: DocumentVisitor): void {
    visitor.visitLink(this);
  }
  
  getContent(): string {
    return this.text;
  }
  
  getAttributes(): Record<string, any> {
    return this.attributes;
  }
  
  getHref(): string {
    return this.href;
  }
}

// Document container
class Document {
  private elements: DocumentElement[] = [];
  
  addElement(element: DocumentElement): void {
    this.elements.push(element);
  }
  
  accept(visitor: DocumentVisitor): void {
    for (const element of this.elements) {
      element.accept(visitor);
    }
  }
}

// Concrete Visitors
class HTMLExportVisitor implements DocumentVisitor {
  private html: string = '';
  
  visitText(element: TextElement): void {
    const attrs = element.getAttributes();
    let style = '';
    if (attrs.bold) style += 'font-weight: bold; ';
    if (attrs.italic) style += 'font-style: italic; ';
    if (attrs.color) style += `color: ${attrs.color}; `;
    
    this.html += `<p${style ? ` style="${style}"` : ''}>${element.getContent()}</p>\n`;
  }
  
  visitImage(element: ImageElement): void {
    const attrs = element.getAttributes();
    this.html += `<img src="${attrs.src}" alt="${attrs.alt}"${
      attrs.width ? ` width="${attrs.width}"` : ''
    }${attrs.height ? ` height="${attrs.height}"` : ''}>\n`;
  }
  
  visitTable(element: TableElement): void {
    this.html += '<table border="1">\n';
    for (const row of element.getData()) {
      this.html += '  <tr>\n';
      for (const cell of row) {
        this.html += `    <td>${cell}</td>\n`;
      }
      this.html += '  </tr>\n';
    }
    this.html += '</table>\n';
  }
  
  visitLink(element: LinkElement): void {
    const attrs = element.getAttributes();
    this.html += `<a href="${attrs.href}"${
      attrs.target ? ` target="${attrs.target}"` : ''
    }>${element.getContent()}</a>\n`;
  }
  
  getResult(): string {
    return `<!DOCTYPE html>\n<html>\n<body>\n${this.html}</body>\n</html>`;
  }
}

class MarkdownExportVisitor implements DocumentVisitor {
  private markdown: string = '';
  
  visitText(element: TextElement): void {
    const attrs = element.getAttributes();
    let content = element.getContent();
    
    if (attrs.bold) content = `**${content}**`;
    if (attrs.italic) content = `*${content}*`;
    
    this.markdown += `${content}\n\n`;
  }
  
  visitImage(element: ImageElement): void {
    const attrs = element.getAttributes();
    this.markdown += `![${attrs.alt}](${attrs.src})\n\n`;
  }
  
  visitTable(element: TableElement): void {
    const data = element.getData();
    
    // Table header
    this.markdown += '| ' + data[0].join(' | ') + ' |\n';
    // Table separator
    this.markdown += '| ' + data[0].map(() => '---').join(' | ') + ' |\n';
    
    // Table rows
    for (let i = 1; i < data.length; i++) {
      this.markdown += '| ' + data[i].join(' | ') + ' |\n';
    }
    
    this.markdown += '\n';
  }
  
  visitLink(element: LinkElement): void {
    const content = element.getContent();
    const href = element.getAttributes().href;
    this.markdown += `[${content}](${href})\n\n`;
  }
  
  getResult(): string {
    return this.markdown;
  }
}

class ContentAnalysisVisitor implements DocumentVisitor {
  private wordCount: number = 0;
  private imageCount: number = 0;
  private tableCount: number = 0;
  private linkCount: number = 0;
  
  visitText(element: TextElement): void {
    const words = element.getContent().trim().split(/\s+/);
    this.wordCount += words.length;
  }
  
  visitImage(element: ImageElement): void {
    this.imageCount += 1;
  }
  
  visitTable(element: TableElement): void {
    this.tableCount += 1;
  }
  
  visitLink(element: LinkElement): void {
    this.linkCount += 1;
  }
  
  getResult(): Record<string, any> {
    return {
      wordCount: this.wordCount,
      imageCount: this.imageCount,
      tableCount: this.tableCount,
      linkCount: this.linkCount,
      totalElements: this.wordCount + this.imageCount + this.tableCount + this.linkCount
    };
  }
}

// Usage
const doc = new Document();

doc.addElement(new TextElement("This is a document title", { bold: true }));
doc.addElement(new TextElement("This is a paragraph with some content."));
doc.addElement(new ImageElement("image.jpg", "A sample image", { width: 300 }));
doc.addElement(new TableElement([
  ["Name", "Age", "Occupation"],
  ["John", "30", "Developer"],
  ["Jane", "28", "Designer"]
]));
doc.addElement(new LinkElement("Visit our website", "https://example.com"));

// Export to HTML without modifying Document or element classes
const htmlVisitor = new HTMLExportVisitor();
doc.accept(htmlVisitor);
console.log("HTML Export:");
console.log(htmlVisitor.getResult());

// Export to Markdown using the same document
const markdownVisitor = new MarkdownExportVisitor();
doc.accept(markdownVisitor);
console.log("Markdown Export:");
console.log(markdownVisitor.getResult());

// Analyze content
const analysisVisitor = new ContentAnalysisVisitor();
doc.accept(analysisVisitor);
console.log("Document Analysis:");
console.log(analysisVisitor.getResult());

How Visitor Pattern Works: Sequence Diagram

When I Use It

• Adding operations to complex object structures

• Cross-cutting concerns like exporting, rendering, validation

• Operations that differ based on concrete element types

• Situations where object structures rarely change but operations evolve

---

10. Iterator Pattern: The "Collection Navigator"

My Data Structure Challenge

While building a custom data structure for a file organization system in my hobby project, I struggled with how to let clients traverse the structure without exposing its internal representation. The Iterator pattern provided an elegant solution.

The Problem It Solves

• Provides a way to access elements of a collection sequentially

• Hides the internal representation of the collection

• Supports multiple traversal methods for the same collection

TypeScript Implementation

// Iterator interface
interface Iterator<T> {
  hasNext(): boolean;
  next(): T;
  reset(): void;
}

// Aggregate interface
interface Aggregate<T> {
  createIterator(): Iterator<T>;
}

// File system item class
class FileSystemItem {
  private name: string;
  private isDirectory: boolean;
  private size: number;
  private children: FileSystemItem[] = [];
  private parent: FileSystemItem | null = null;
  private created: Date = new Date();
  
  constructor(name: string, isDirectory: boolean, size: number = 0) {
    this.name = name;
    this.isDirectory = isDirectory;
    this.size = size;
  }
  
  getName(): string {
    return this.name;
  }
  
  getPath(): string {
    if (!this.parent) {
      return this.name;
    }
    return `${this.parent.getPath()}/${this.name}`;
  }
  
  isDir(): boolean {
    return this.isDirectory;
  }
  
  getSize(): number {
    if (!this.isDirectory) {
      return this.size;
    }
    
    // For directories, size is sum of all children
    return this.children.reduce((total, child) => total + child.getSize(), 0);
  }
  
  addItem(item: FileSystemItem): void {
    if (!this.isDirectory) {
      throw new Error("Cannot add items to a file");
    }
    
    item.parent = this;
    this.children.push(item);
  }
  
  getChildren(): FileSystemItem[] {
    return [...this.children];
  }
  
  getCreated(): Date {
    return this.created;
  }
}

// Concrete file system - our custom tree structure
class FileSystem implements Aggregate<FileSystemItem> {
  private root: FileSystemItem;
  
  constructor(rootName: string = "root") {
    this.root = new FileSystemItem(rootName, true);
    
    // For testing, let's add some example files and directories
    const docs = new FileSystemItem("docs", true);
    docs.addItem(new FileSystemItem("resume.pdf", false, 1024));
    docs.addItem(new FileSystemItem("report.docx", false, 2048));
    
    const pictures = new FileSystemItem("pictures", true);
    pictures.addItem(new FileSystemItem("vacation.jpg", false, 3072));
    pictures.addItem(new FileSystemItem("family.png", false, 4096));
    
    const work = new FileSystemItem("work", true);
    const project = new FileSystemItem("project", true);
    project.addItem(new FileSystemItem("spec.md", false, 512));
    project.addItem(new FileSystemItem("code.ts", false, 1024));
    work.addItem(project);
    
    this.root.addItem(docs);
    this.root.addItem(pictures);
    this.root.addItem(work);
  }
  
  getRoot(): FileSystemItem {
    return this.root;
  }
  
  createIterator(): Iterator<FileSystemItem> {
    return new DepthFirstIterator(this.root);
  }
  
  createBreadthFirstIterator(): Iterator<FileSystemItem> {
    return new BreadthFirstIterator(this.root);
  }
  
  createFilesOnlyIterator(): Iterator<FileSystemItem> {
    return new FilesOnlyIterator(this.root);
  }
}

// Concrete Iterator - Depth First
class DepthFirstIterator implements Iterator<FileSystemItem> {
  private root: FileSystemItem;
  private stack: FileSystemItem[] = [];
  private current: number = -1;
  
  constructor(root: FileSystemItem) {
    this.root = root;
    this.reset();
  }
  
  private depthFirstTraversal(item: FileSystemItem, items: FileSystemItem[]): void {
    items.push(item);
    
    if (item.isDir()) {
      for (const child of item.getChildren()) {
        this.depthFirstTraversal(child, items);
      }
    }
  }
  
  hasNext(): boolean {
    return this.current < this.stack.length - 1;
  }
  
  next(): FileSystemItem {
    if (!this.hasNext()) {
      throw new Error("No more items");
    }
    
    this.current++;
    return this.stack[this.current];
  }
  
  reset(): void {
    this.stack = [];
    this.current = -1;
    this.depthFirstTraversal(this.root, this.stack);
  }
}

// Concrete Iterator - Breadth First
class BreadthFirstIterator implements Iterator<FileSystemItem> {
  private root: FileSystemItem;
  private queue: FileSystemItem[] = [];
  private current: number = -1;
  
  constructor(root: FileSystemItem) {
    this.root = root;
    this.reset();
  }
  
  private breadthFirstTraversal(root: FileSystemItem): FileSystemItem[] {
    const items: FileSystemItem[] = [];
    const queue: FileSystemItem[] = [root];
    
    while (queue.length > 0) {
      const item = queue.shift()!;
      items.push(item);
      
      if (item.isDir()) {
        for (const child of item.getChildren()) {
          queue.push(child);
        }
      }
    }
    
    return items;
  }
  
  hasNext(): boolean {
    return this.current < this.queue.length - 1;
  }
  
  next(): FileSystemItem {
    if (!this.hasNext()) {
      throw new Error("No more items");
    }
    
    this.current++;
    return this.queue[this.current];
  }
  
  reset(): void {
    this.queue = this.breadthFirstTraversal(this.root);
    this.current = -1;
  }
}

// Concrete Iterator - Files Only
class FilesOnlyIterator implements Iterator<FileSystemItem> {
  private root: FileSystemItem;
  private files: FileSystemItem[] = [];
  private current: number = -1;
  
  constructor(root: FileSystemItem) {
    this.root = root;
    this.reset();
  }
  
  private collectFiles(item: FileSystemItem, files: FileSystemItem[]): void {
    if (!item.isDir()) {
      files.push(item);
    } else {
      for (const child of item.getChildren()) {
        this.collectFiles(child, files);
      }
    }
  }
  
  hasNext(): boolean {
    return this.current < this.files.length - 1;
  }
  
  next(): FileSystemItem {
    if (!this.hasNext()) {
      throw new Error("No more items");
    }
    
    this.current++;
    return this.files[this.current];
  }
  
  reset(): void {
    this.files = [];
    this.current = -1;
    this.collectFiles(this.root, this.files);
  }
}

// Usage
const fileSystem = new FileSystem();

console.log("Depth-First Traversal:");
const depthIterator = fileSystem.createIterator();
while (depthIterator.hasNext()) {
  const item = depthIterator.next();
  console.log(`${item.isDir() ? 'Directory' : 'File'}: ${item.getPath()} (${item.getSize()} bytes)`);
}

console.log("\nBreadth-First Traversal:");
const breadthIterator = fileSystem.createBreadthFirstIterator();
while (breadthIterator.hasNext()) {
  const item = breadthIterator.next();
  console.log(`${item.isDir() ? 'Directory' : 'File'}: ${item.getPath()}`);
}

console.log("\nFiles Only:");
const filesIterator = fileSystem.createFilesOnlyIterator();
while (filesIterator.hasNext()) {
  const file = filesIterator.next();
  console.log(`File: ${file.getPath()} (${file.getSize()} bytes)`);
}

How Iterator Pattern Works: Sequence Diagram

When I Use It

• Traversing collections with complex internal structures

• Supporting multiple traversal methods

• Providing a standard way to iterate

• Parallel iteration over the same collection

---

11. Interpreter Pattern: The "Language Processor"

My Personal Project Challenge

While building a search feature for my personal note-taking application, I needed to parse and interpret complex search expressions (e.g., "type:pdf AND (size>1MB OR created:last-week)"). The Interpreter pattern helped me build a clean, extensible solution.

The Problem It Solves

• Interprets sentences in a given language or grammar

• Represents the grammar as class hierarchies

• Evaluates expressions in the defined language

TypeScript Implementation

// The context/environment for our interpreter
interface SearchContext {
  getDocumentType(doc: Document): string;
  getDocumentSize(doc: Document): number;
  getCreationDate(doc: Document): Date;
  getCurrentDate(): Date;
}

// Document interface
interface Document {
  id: string;
  name: string;
  type: string;
  size: number;
  created: Date;
  content: string;
  metadata: Record<string, any>;
}

// Abstract Expression
interface Expression {
  interpret(context: SearchContext, doc: Document): boolean;
  toString(): string;
}

// Terminal Expressions
class TypeExpression implements Expression {
  constructor(private type: string) {}
  
  interpret(context: SearchContext, doc: Document): boolean {
    return context.getDocumentType(doc).toLowerCase() === this.type.toLowerCase();
  }
  
  toString(): string {
    return `type:${this.type}`;
  }
}

class SizeExpression implements Expression {
  constructor(
    private operator: '>' | '<' | '=' | '>=' | '<=',
    private size: number
  ) {}
  
  interpret(context: SearchContext, doc: Document): boolean {
    const docSize = context.getDocumentSize(doc);
    
    switch (this.operator) {
      case '>': return docSize > this.size;
      case '<': return docSize < this.size;
      case '=': return docSize === this.size;
      case '>=': return docSize >= this.size;
      case '<=': return docSize <= this.size;
      default: return false;
    }
  }
  
  toString(): string {
    return `size${this.operator}${this.size}`;
  }
}

class DateExpression implements Expression {
  constructor(
    private period: 'today' | 'yesterday' | 'last-week' | 'last-month'
  ) {}
  
  interpret(context: SearchContext, doc: Document): boolean {
    const docDate = context.getCreationDate(doc);
    const now = context.getCurrentDate();
    const oneDayMs = 24 * 60 * 60 * 1000;
    
    switch (this.period) {
      case 'today':
        return docDate.toDateString() === now.toDateString();
      case 'yesterday': {
        const yesterday = new Date(now.getTime() - oneDayMs);
        return docDate.toDateString() === yesterday.toDateString();
      }
      case 'last-week': {
        const weekAgo = new Date(now.getTime() - 7 * oneDayMs);
        return docDate >= weekAgo;
      }
      case 'last-month': {
        const monthAgo = new Date(now.getTime());
        monthAgo.setMonth(monthAgo.getMonth() - 1);
        return docDate >= monthAgo;
      }
      default:
        return false;
    }
  }
  
  toString(): string {
    return `created:${this.period}`;
  }
}

class ContentExpression implements Expression {
  constructor(private keyword: string) {}
  
  interpret(context: SearchContext, doc: Document): boolean {
    return doc.content.toLowerCase().includes(this.keyword.toLowerCase());
  }
  
  toString(): string {
    return `content:"${this.keyword}"`;
  }
}

// Non-terminal Expressions
class AndExpression implements Expression {
  constructor(private left: Expression, private right: Expression) {}
  
  interpret(context: SearchContext, doc: Document): boolean {
    return this.left.interpret(context, doc) && this.right.interpret(context, doc);
  }
  
  toString(): string {
    return `(${this.left.toString()} AND ${this.right.toString()})`;
  }
}

class OrExpression implements Expression {
  constructor(private left: Expression, private right: Expression) {}
  
  interpret(context: SearchContext, doc: Document): boolean {
    return this.left.interpret(context, doc) || this.right.interpret(context, doc);
  }
  
  toString(): string {
    return `(${this.left.toString()} OR ${this.right.toString()})`;
  }
}

class NotExpression implements Expression {
  constructor(private expression: Expression) {}
  
  interpret(context: SearchContext, doc: Document): boolean {
    return !this.expression.interpret(context, doc);
  }
  
  toString(): string {
    return `NOT (${this.expression.toString()})`;
  }
}

// Simple parser for our search language
class SearchParser {
  parse(query: string): Expression {
    // This is a simplified parser - a real one would be more complex
    if (query.includes(' AND ')) {
      const [leftStr, rightStr] = query.split(' AND ').map(s => s.trim());
      return new AndExpression(this.parse(leftStr), this.parse(rightStr));
    } 
    else if (query.includes(' OR ')) {
      const [leftStr, rightStr] = query.split(' OR ').map(s => s.trim());
      return new OrExpression(this.parse(leftStr), this.parse(rightStr));
    }
    else if (query.startsWith('NOT ')) {
      return new NotExpression(this.parse(query.substring(4)));
    }
    else if (query.startsWith('type:')) {
      return new TypeExpression(query.substring(5));
    }
    else if (query.startsWith('size>')) {
      return new SizeExpression('>', parseInt(query.substring(5)));
    }
    else if (query.startsWith('size<')) {
      return new SizeExpression('<', parseInt(query.substring(5)));
    }
    else if (query.startsWith('created:')) {
      const period = query.substring(8) as 'today' | 'yesterday' | 'last-week' | 'last-month';
      return new DateExpression(period);
    }
    else if (query.startsWith('content:"') && query.endsWith('"')) {
      return new ContentExpression(query.substring(9, query.length - 1));
    }
    
    // Default to content search if no specific prefix is used
    return new ContentExpression(query);
  }
}

// Concrete implementation of the context
class DocumentSearchContext implements SearchContext {
  getDocumentType(doc: Document): string {
    return doc.type;
  }
  
  getDocumentSize(doc: Document): number {
    return doc.size;
  }
  
  getCreationDate(doc: Document): Date {
    return doc.created;
  }
  
  getCurrentDate(): Date {
    return new Date();
  }
}

// Document repository
class DocumentRepository {
  private documents: Document[] = [];
  private context: SearchContext = new DocumentSearchContext();
  private parser: SearchParser = new SearchParser();
  
  constructor() {
    // Sample documents
    const now = new Date();
    const yesterday = new Date(now);
    yesterday.setDate(yesterday.getDate() - 1);
    const lastWeek = new Date(now);
    lastWeek.setDate(lastWeek.getDate() - 6);
    const lastMonth = new Date(now);
    lastMonth.setMonth(lastMonth.getMonth() - 1);
    
    this.documents = [
      {
        id: '1',
        name: 'Project Plan.pdf',
        type: 'pdf',
        size: 2 * 1024 * 1024, // 2MB
        created: yesterday,
        content: 'This is the project plan for Q3 2023',
        metadata: { author: 'John', department: 'Planning' }
      },
      {
        id: '2',
        name: 'Financial Report.xlsx',
        type: 'xlsx',
        size: 1.5 * 1024 * 1024, // 1.5MB
        created: lastWeek,
        content: 'Financial data for Q2 2023',
        metadata: { author: 'Jane', department: 'Finance' }
      },
      {
        id: '3',
        name: 'Presentation.pptx',
        type: 'pptx',
        size: 5 * 1024 * 1024, // 5MB
        created: now,
        content: 'Product roadmap presentation',
        metadata: { author: 'Mike', department: 'Product' }
      },
      {
        id: '4',
        name: 'Requirements.doc',
        type: 'doc',
        size: 500 * 1024, // 500KB
        created: lastMonth,
        content: 'System requirements specification',
        metadata: { author: 'Sarah', department: 'Engineering' }
      }
    ];
  }
  
  search(queryString: string): Document[] {
    console.log(`Executing search query: ${queryString}`);
    
    try {
      const expression = this.parser.parse(queryString);
      console.log(`Parsed expression: ${expression.toString()}`);
      
      return this.documents.filter(doc => 
        expression.interpret(this.context, doc)
      );
    } catch (error) {
      console.error(`Error parsing query: ${error}`);
      return [];
    }
  }
}

// Usage
const repo = new DocumentRepository();

// Search for PDF documents larger than 1MB
const query1 = "type:pdf AND size>1000000";
const results1 = repo.search(query1);
console.log(`Results for "${query1}":`);
results1.forEach(doc => console.log(` - ${doc.name} (${doc.type}, ${doc.size / 1024 / 1024}MB)`));

// Search for documents created in the last week that are not PPTX
const query2 = "created:last-week AND NOT type:pptx";
const results2 = repo.search(query2);
console.log(`\nResults for "${query2}":`);
results2.forEach(doc => console.log(` - ${doc.name} (${doc.type}, created: ${doc.created.toDateString()})`));

// Search for documents containing "requirement" or "financial" in content
const query3 = 'content:"requirement" OR content:"financial"';
const results3 = repo.search(query3);
console.log(`\nResults for "${query3}":`);
results3.forEach(doc => console.log(` - ${doc.name} (snippet: ${doc.content.substring(0, 30)}...)`));

How Interpreter Pattern Works: Sequence Diagram

When I Use It

• Domain-specific languages (DSLs)

• Query languages for databases or search engines

• Expression evaluation systems

• Rule engines or validation frameworks

---

My Personal Recommendations: When to Use Each Pattern

Based on my experience across different personal development projects, here's my guide for choosing the right behavioral pattern:

✅ Observer Pattern

Use when:

• Multiple objects need to be notified of state changes

• You want loose coupling between subjects and observers

• Building event-driven architectures

Avoid when:

• Observer relationships are complex or create circular dependencies

• Performance is critical (notifications can be expensive)

✅ Strategy Pattern

Use when:

• You have multiple ways to perform a task

• You want to switch algorithms at runtime

• Eliminating conditional logic

Avoid when:

• You have only one algorithm

• The strategies are too simple to warrant the pattern overhead

✅ Command Pattern

Use when:

• You need undo/redo functionality

• Queuing, logging, or scheduling operations

• Decoupling request senders from receivers

Avoid when:

• Simple method calls suffice

• The added abstraction doesn't provide value

✅ State Pattern

Use when:

• Object behavior changes based on state

• You have complex state transitions

• Eliminating large conditional statements

Avoid when:

• State transitions are simple or rarely change

• The overhead of multiple classes isn't justified

✅ Template Method Pattern

Use when:

• Multiple classes share similar algorithms with variations

• You want to enforce a specific algorithm structure

• Code reuse is important

Avoid when:

• The algorithm steps vary significantly

• You need runtime flexibility in the algorithm structure

✅ Chain of Responsibility Pattern

Use when:

• Multiple objects might handle a request

• The handlers can vary at runtime

• You want to avoid coupling senders to specific receivers

Avoid when:

• You always know which handler should process the request

• The chain becomes too long and impacts performance

✅ Mediator Pattern

Use when:

• Many objects communicate with each other in complex ways

• You want to reduce coupling between components

• Component interactions change frequently

Avoid when:

• Communication between components is simple or direct

• The mediator becomes a monolithic "god object"

✅ Memento Pattern

Use when:

• You need to restore object state to a previous point

• Direct access to state would violate encapsulation

• You need to implement undo/redo functionality

Avoid when:

• Storing and restoring state is resource-intensive

• Object states rarely need to be saved or restored

✅ Visitor Pattern

Use when:

• You need to perform operations across a complex object structure

• Operations differ based on concrete element types

• You want to add new operations without changing element classes

Avoid when:

• The object structure changes frequently

• There are only a few operations and they rarely change

✅ Iterator Pattern

Use when:

• You need to traverse a collection without exposing its structure

• Multiple traversal algorithms are needed for the same collection

• A uniform way to iterate is needed

Avoid when:

• The traversal algorithm is simple and won't change

• The collection structure is straightforward (like arrays)

✅ Interpreter Pattern

Use when:

• You're parsing and evaluating expressions in a simple language

• The grammar is relatively simple and fixed

• Performance is not a critical concern

Avoid when:

• The language grammar is complex (use parser generators instead)

• Performance is critical (interpreters are typically slower)

• The grammar changes frequently

Key Takeaways from My Journey

1. Start with Communication Needs: Identify how objects need to interact before choosing a pattern.

2. Favor Composition Over Inheritance: Many behavioral patterns use composition to achieve flexibility.

3. Consider Runtime Flexibility: Behavioral patterns excel at runtime behavior modification.

4. Don't Over-Engineer: Simple problems don't always need pattern solutions.

5. Test Behavioral Changes: These patterns often involve complex interactions—thorough testing is essential.

Pattern Combinations in My Projects

In my personal projects, I often combine behavioral patterns for powerful solutions:

• Observer + Command: In my dashboard app with undo capability

• Strategy + State: In my game project with dynamic character behaviors

• Chain of Responsibility + Command: In my logging and request processing system

• Template Method + Strategy: In my code generator tool

• Mediator + Observer: In my messaging application's UI components

• Memento + Command: In my diagram editor's multi-level undo system

• Visitor + Iterator: In my document processor's export functionality

• Interpreter + Composite: In my note-taking app's search feature

Conclusion

Mastering behavioral design patterns has transformed how I design object interactions and system behaviors in my personal projects. They've helped me build more flexible, maintainable, and testable applications even when working alone on side projects.

Throughout my journey with these 11 patterns—Observer, Strategy, Command, State, Template Method, Chain of Responsibility, Mediator, Memento, Visitor, Iterator, and Interpreter—I've learned that each solves a specific communication challenge between objects.

The key to using these patterns effectively is understanding the communication and responsibility challenges in your system. Start with clear requirements about how objects should interact, then apply patterns that solve those specific problems.

Remember, patterns are tools to solve problems, not goals in themselves. Even in personal projects, choose the pattern that makes your code more maintainable and your intent clearer, as you might want to revisit or expand the project later.

What behavioral patterns have you found most useful in your personal development projects? I'd love to hear about your experiences in the comments below!