Mediator Pattern — Central coordination

A mediator routes interactions between components to reduce coupling.

Example (TypeScript)

type Event = { type: 'open' | 'close' };

class UIHub {
  private handlers: Array<(event: Event) => void> = [];
  register(handler: (event: Event) => void) { this.handlers.push(handler); }
  notify(event: Event) { this.handlers.forEach((handler) => handler(event)); }
}

const hub = new UIHub();
hub.register((event) => event.type === 'open' && console.log('panel opened'));
hub.notify({ type: 'open' });

Why it matters

• Prevents components from directly depending on each other.
• Centralizes complex UI orchestration.

Questions & Answers