设计模式系列之三观察者模式

先来看看观察者模式的定义

观察者模式：定义了对象之间的一对多依赖，这样一来，当一个对象改变状态时，它的所有依赖者都会收到通知并自动更新。

Java实现

下面以消息中心的需求作为例子。有一个消息中心，当消息中心收到新消息时，动态通知所有的收听者。

消息中心部分

public interface Subject {
    //- 注册收听者
    public void registerObserver(Observer o);
    //- 移除收听者
    public void removeObserver(Observer o);
    //- 通知收听者
    public void notifyObservers();
}

public class MessageCenter implements Subject {
    private ArrayList observers;
    private String message;

    public MessageCenter() {
        //- 保存所有的收听者
        observers = new ArrayList();
    }

    public void registerObserver(Observer o) {
        observers.add(o);
    }

    public void removeObserver(Observer o) {
        int i = observers.indexOf(o);
        if (i >= 0) {
            observers.remove(i);
        }
    }
    /**
     * 通知所有人
     */
    public void notifyObservers() {
        for (Observer observer : observers) {
            observer.printMessage(message);
        }
    }
    /**
     * 收到新消息触发
     */
    public void newMessage() {
        notifyObservers();
    }

    //模拟收到消息
    public void setMessage(String message) {
        this.message = message;
        newMessage();
    }
}

收听者部分

public interface Observer {
    public void printMessage(String message);
}

public class UserOne implements Observer {
    private Subject messageCenter;

    public UserOne(Subject messageCenter) {
        this.messageCenter = messageCenter;
        this.messageCenter.registerObserver(this);
    }

    public void printMessage(String message) {
        System.out.println("UserOne:"+message);
    }
}

public class UserTwo implements Observer {
    private Subject messageCenter;

    public UserTwo(Subject messageCenter) {
        this.messageCenter = messageCenter;
        this.messageCenter.registerObserver(this);
    }

    public void printMessage(String message) {
        System.out.println("UserTwo:"+message);
    }
}

测试

public class Test {
    public static void main(String[] args) {
        MessageCenter messageCenter = new MessageCenter();
        UserOne one = new UserOne(messageCenter);
        UserTwo two = new UserTwo(messageCenter);

        //这里One和Two都能收到消息
        messageCenter.setMessage("First Message!");
        //移除用户One
        messageCenter.removeObserver(one);
        //这里就只有UserTwo能收到消息了
        messageCenter.setMessage("Second Message!");
    }
}

JavaScript实现

在javascript中，最常见的例子就是jquery中的自定义事件,当事件触发时，会通知所有的事件收听者。

    
    


Button

样例

(function () {
    function MessageCenter() {
        this.observers  = {};
        this.newMessage = "";
    }
    MessageCenter.fn = MessageCenter.prototype;
    //注册收听者
    MessageCenter.fn.registerObserver = function (id,observer) {
        this.observers[id] = observer;
    };
    //移除收听者
    MessageCenter.fn.removeObserver = function (id) {
        delete this.observers[id];
    };
    //通知所有收听者
    MessageCenter.fn.notifyObservers = function () {
        for(var key in this.observers){
            this.observers[key].apply(this,[this.newMessage]);
        }
    };
    //模拟收到新消息
    MessageCenter.fn.setMessage = function (msg) {
        this.newMessage = msg;
        this.notifyObservers();
    };

    /**
     * 收听者UserOne
     * @param subject
     * @constructor
     */
    function UserOne(subject) {
        subject.registerObserver("UserOne",function (msg) {
            console.log("我是UserOne，我收到的消息是:"+msg);
        })
    }

    /**
     * 收听者UserTwo
     * @param subject
     * @constructor
     */
    function UserTwo(subject) {
        subject.registerObserver("UserTwo",function (msg) {
            console.log("我是UserTwo，我收到的消息是:"+msg);
        })
    }

    //测试代码
    var msgCenter = new MessageCenter();
    new UserOne(msgCenter);
    new UserTwo(msgCenter);
    //这里One和Two都能收到消息
    msgCenter.setMessage("First Message!");
    //移除UserOne
    msgCenter.removeObserver("UserOne");
    //这里就只有UserTwo能收到消息了
    msgCenter.setMessage("Second Message!");
})();

上一篇：设计模式系列之二策略模式
下一篇：设计模式系列之四装饰者模式