Penjelasan pola Mediator beserta contohnya

Tujuan dan masalah yang diselesaikan

Tujuan: mendefinisikan objek yang membungkus cara sekumpulan objek berinteraksi. Mediator mendorong loose coupling dengan mencegah objek saling merujuk secara eksplisit, dan memungkinkan Anda mengubah interaksi mereka secara mandiri. Ini salah satu pola behavioral dalam buku Gang of Four (GoF).

Perhatikan form pendaftaran dengan checkbox "akun perusahaan", kolom nama perusahaan, kolom email, dan tombol kirim. Saat checkbox dicentang, kolom perusahaan harus muncul dan menjadi wajib. Tombol kirim hanya aktif bila setiap kolom wajib valid. Jika setiap komponen memperbarui yang lain secara langsung, checkbox mengenal kolom perusahaan dan tombol, kolom email mengenal tombol, dan seterusnya. Setiap aturan baru menambah referensi silang, dan tidak ada komponen yang bisa dipakai ulang di form lain.

Dengan mediator, komponen hanya melaporkan event seperti "saya berubah". Objek form, yang bertindak sebagai mediator, menyimpan semua aturan tentang bagaimana kolom saling memengaruhi. Komponen menjadi sederhana dan dapat dipakai ulang, dan logika interaksi berada di satu tempat.

Struktur dan peserta

Tanpa mediator, n komponen yang semuanya saling berbicara bisa membutuhkan hingga n × (n − 1) / 2 hubungan. Dengan mediator, setiap komponen hanya punya satu hubungan: ke mediator.

Implementasi TypeScript

Setiap kolom melaporkan perubahan ke mediator. SignUpForm adalah concrete mediator: ia menampilkan atau menyembunyikan kolom perusahaan dan mengaktifkan tombol.

interface Mediator {
  notify(sender: Component, event: string): void;
}

class Component {
  constructor(protected mediator: Mediator, readonly name: string) {}
}

class Checkbox extends Component {
  checked = false;
  toggle() { this.checked = !this.checked; this.mediator.notify(this, "change"); }
}
class TextField extends Component {
  value = "";
  visible = true;
  type(text: string) { this.value = text; this.mediator.notify(this, "change"); }
}
class Button extends Component { enabled = false; }

class SignUpForm implements Mediator {
  isCompany = new Checkbox(this, "isCompany");
  company = new TextField(this, "company");
  email = new TextField(this, "email");
  submit = new Button(this, "submit");
  constructor() { this.company.visible = false; }

  notify(sender: Component, event: string) {
    if (sender === this.isCompany) this.company.visible = this.isCompany.checked;
    const emailOk = this.email.value.includes("@");
    const companyOk = !this.company.visible || this.company.value.length > 0;
    this.submit.enabled = emailOk && companyOk;
    console.log(sender.name, event, "-> submit enabled:", this.submit.enabled);
  }
}

const form = new SignUpForm();
form.email.type("[email protected]"); // email change -> submit enabled: true
form.isCompany.toggle();            // isCompany change -> submit enabled: false
form.company.type("Acme");          // company change -> submit enabled: true

Perhatikan bahwa Checkbox dan TextField tidak tahu bahwa kolom lain ada. Anda bisa memakainya ulang di form yang sama sekali berbeda dengan memberi mereka mediator yang berbeda.

Kapan dipakai dan kapan tidak

• Pakai bila sekelompok objek berkomunikasi dengan cara yang kompleks tetapi terdefinisi dengan baik, dan ketergantungan di antara mereka sulit diikuti.
• Pakai bila Anda ingin memakai ulang komponen yang saat ini tidak bisa dipisahkan karena saling merujuk.
• Pakai bila aturan interaksi sering berubah dan Anda ingin mengeditnya di satu tempat.
• Jangan dipakai untuk dua objek yang cukup saling memanggil; pemanggilan langsung lebih jelas.
• Jangan dipakai bila komponen hanya perlu menyiarkan event ke siapa pun yang berminat. Event emitter biasa (Observer) lebih ringan.

Penggunaan di dunia nyata

• Controller form dan dialog di framework GUI: komponen induk memegang state dan memutuskan bagaimana input anak saling memengaruhi, sementara anak hanya memunculkan event. Di React, "lifting state up" ke induk bersama mengikuti gagasan ini.
• Aplikasi chat: pengguna tidak mengirim pesan langsung satu sama lain; ruang obrolan atau server menerima setiap pesan dan mengirimkannya ke anggota yang tepat.
• Message broker dan event bus antarlayanan: pengirim mempublikasikan ke broker, yang mengarahkan pesan ke penerima yang tidak dikenal pengirimnya.
• Pengatur lalu lintas udara adalah analogi klasik: pesawat tidak bernegosiasi dengan setiap pesawat lain, mereka hanya berbicara dengan menara kontrol.

Mediator vs Observer dan pola lainnya