中介者模式

提出问题

在代码中，一个对象可能会调用多个对象的方法，或者说需要与多个对象进行交互，每个对象都是如此。这样，对象与对象两两之间就产生了复杂的依赖关系。结构非常混乱。如果要改动一处，可能系统中全部对象都跟随着需要进行改动。

例如，我们在系统中经常会有这样的需求：从列表中选择某个项目后，需要将项目详细信息显示在各个文本框中，以便进行修改。还有一个新增按钮，可以使用这些文本框向列表中增加一个项目。这样（如果要原生实现的话），需要列表维持对所有文本框的引用，新增按钮也需要维持对列表和所有文本框的引用。这时候我们如果要新增一个文本框，那就需要在列表类中增加这个文本框，同时还需要在按钮类中增加这个文本框。

有没有什么办法，能不让系统中到处都互相引用组件呢？

解决问题

答案就是引入一个中介者，让中介者维持对各种组件的引用。

比如在上个例子中，我们加入中介者，按钮点击后不是直接通知列表和文本框，而是通知中介者，再由中介者通知列表和文本框。其他的也以同样的方式进行交互。这样，如果需要添加一个文本框时，只需要在中介者中添加一个对文本框的引用，其他地方就不需要了。

下面上代码：

class Component {
    setMediator(mediator) {
        this.mediator = mediator;
    }

    changed() {
        // 通知中介者组件发生了改变
        mediator.notify(this);
    }
}

class Button extends Component {
    // ...
}

class List extends Component {
    update(array) {
        // 更新列表内容
        // ...
    }
}

class TextBox extends Compoenent {
    update(content) {
        // 更新文本框内容
        // ...
    }
}

class Mediator {
    constructor(button, list, textbox) {
        this.button = button;
        this.list = list;
        this.textbox = textbox;
    }

    notify(component) {
        if(component==button) {
            list.update();
            textbox.update();
        }
        if(component==list) {
            textbox.update();
        }
    }
}

let button = new Button();
let list = new List();
let textbox = new TextBox();
let mediator = new Mediator(button, list, textbox);

list.changed();
button.changed();