观察者模式/订阅者模式

2020-09-23  本文已影响0人  ticktackkk
   <script>
      //观察者模式
      var Observer = (function () {
        var _messages = {}; //容器
        return {
          //订阅信息接口
          regist: function (type, fn) {
            //消息类型和相应的处理方法
            //如果此信息不存咋则创建一个消息类型
            if (typeof _messages[type] === "undefined") {
              _messages[type] = [fn];
            } else {
              //存在则将动作方法推入到对应的动作序列中
              _messages[type].push(fn);
            }
          },
          //发布信息接口
          fire: function (type, args) {
            //消息类型个要传递的参数
            //如果这个消息没有被注册,则返回
            if (!_messages[type]) {
              return;
            }
            //定义消息信息
            var events = {
              type: type, //消息类型
              args: args || {}, //消息携带数据
            };
            for (let i = 0; i < _messages[type].length; i++) {
              //遍历动作
              _messages[type][i].call(this, events); //依次执行注册的消息对应的队列
            }
          },
          //移除信息接口
          remove: function (type, fn) {
            //如果消息队列存在
            if (_messages[type] instanceof Array) {
              for (let i = _messages[type].length - 1; i >= 0; i--) {
                //从最后一个消息开始便利
                //如果存在该动作则在消息动作序列中移除相应的动作
                _messages[type][i] === fn && _messages[type].splice(i, 1);
              }
            }
          },
        };
      })();

      var Student = function (result) {
        var that = this;
        this.result = result;
        this.say = function () {
          console.log(that.result);
        };
      };
      Student.prototype.answer = function (question) {
        Observer.regist(question, this.say);//学生订阅问题
      };
      Student.prototype.sleep = function (question) {
        console.log(
          this.result + "---->" + question + "--->已经睡着--->取消对老师的监听"
        );
        Observer.remove(question, this.say);//移除取消对老师的监听
      };
      var Teacher = function () {};
      Teacher.prototype.ask = function (question) {
        console.log("问题是:" + question);
        Observer.fire(question);//老师发布问题
      };
      var student1 = new Student("学生1回答问题");
      student2 = new Student("学生2回答问题");
      student3 = new Student("学生3回答问题");
      student1.answer("什么是设计模式");
      student1.answer("简述观察者模式");
      student2.answer("什么是设计模式");
      student3.answer("什么是设计模式");
      student3.answer("简述观察者模式");
      student3.sleep("简述观察者模式");

      var teacher = new Teacher();
      teacher.ask("什么是设计模式");
      teacher.ask("简述观察者模式");
    </script>
上一篇下一篇

猜你喜欢

热点阅读