Mediator Design Pattern Explained

The Mediator pattern centralises communication between objects in one mediator, so they talk to it instead of to each other. It reduces tangled many-to-many dependencies.

The concept

Components know only the mediator. When something happens they notify it, and it coordinates the reactions.

Chat rooms, air-traffic control and UI forms (field A changes → mediator updates B and C) are mediators.

Hub and spokes

Practical examples

Chat room

class Room {
  users = new Set()
  join(u) { this.users.add(u); u.room = this }
  send(from, msg) { for (const u of this.users) if (u !== from) u.receive(from.name, msg) }
}

Form mediator

form.on('country', (c) => { stateSelect.load(c); phone.setPrefix(c) })

Event bus

bus.emit('cart:changed', cart)

Common mistakes

• The mediator becoming a god object.
• Hiding too much logic inside it.
• Tight coupling between mediator and every component.

Key takeaways

• Central coordinator.
• Fewer direct dependencies.
• Keep it small.

FAQ

Mediator vs Observer?

Observer broadcasts to subscribers; Mediator coordinates two-way interactions.

Mediator vs Facade?

Facade is one-directional simplification; Mediator manages interaction among peers.