观察者模式又叫发布——订阅模式,顾名思义pub——sub就是被动触发的,:不要给我......,我会给你.......就是一个发布订阅的解释,实质就是对程序中的某个对象状态进行监听观察,并且在该对象发生改变时能得到通知,下面我通过一个通用的Observer来方便对象实现发布订阅,

var Observer = {
  addSub: function(callback){
    this._subList.push(callback);
  },
  removeSub: function(callback){
    for(var i=0; i<this._subList.length; i++){
      if(this._subList[i] === callback){
        delete this._subList[i];
      }
    }
  },
  publish: function(what){
      for(var i=0; i<this._subList.length; i++){
        if(typeof this._subList[i] === "function"){
          this._subList[i](what);
        }
      }
  },

//使object是发布订阅对象
  makeObserver: function(obj){
      for(var key in this){
        obj[key] = this[key];
        obj._subList = [];
      }
    }
  };
//-----------------------------------------------------------------发布对象

var person1 = {
  recommend: function(str){
    var msg = "person1 发布的数据 " + str;
    this.publish(msg);
  }
};
var person2 = {
  recommend: function(str){
    var msg = "person2 发布的数据 " + str;
    this.publish(msg);
  }
};

Observer.makeObserver(person1);//实现person1对象的发布
Observer.makeObserver(person2);//实现person2对象的发布
//-----------------------------------------------------------------订阅对象

var tom = {
  read: function(what){//订阅方法
    console.log("Tom看到了如下信息:" + what);
  }
};
var jack = {
  show: function(what){
    console.log('jack看到了如下信息:' + what)
  }
}

person1.addSub(tom.read);
person1.addSub(jack.show);
person1.recommend("123");

console.log("........移除jack的订阅..............");
person1.removeSub(jack.show);
person1.recommend("678");
console.log(".............................");

person2.addSub(jack.show);
person2.recommend("456");

javascript 设计模式之观察者模式的更多相关文章

  1. JavaScript设计模式之观察者模式(学习笔记)

    设计模式(Design Pattern)对于软件开发来说其重要性不言而喻,代码可复用.可维护.可扩展一直都是软件工程中的追求!对于我一个学javascript的人来说,理解设计模式似乎有些困难,对仅切 ...

  2. 再起航,我的学习笔记之JavaScript设计模式18(观察者模式)

    观察者模式 观察者模式(Observer): 又被称为发布-订阅者模式或消息机制,定义了一种依赖关系,解决了主体对象与观察者之间功能的耦合. 创建一个观察者对象 首先我们创建一个闭包对象,让其在页面加 ...

  3. JavaScript设计模式-22.观察者模式

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  4. javascript设计模式之观察者模式

    观察者模式又称发布/订阅模式   publish/subscribe 它是一种一对多的关系,让多个观察者对象同时监听某一主题对象,这个主题对象的状态发生变化时就会通知所有的观察者对象,使得他们能够自动 ...

  5. JavaScript设计模式(10)-观察者模式

    观察者模式 1. 介绍 发布者与订阅者是多对多的方式 通过推与拉获取数据:发布者推送到订阅者或订阅者到发布者那边拉 使并行开发的多个实现能彼此独立地进行修改 其实我们在前端开发中使用到的时间监听就是浏 ...

  6. JavaScript设计模式与开发实践 - 观察者模式

    概述 观察者模式又叫发布 - 订阅模式(Publish/Subscribe),它定义了一种一对多的关系,让多个观察者对象同时监听某一个目标对象(为了方便理解,以下将观察者对象叫做订阅者,将目标对象叫做 ...

  7. javaScript 设计模式系列之一:观察者模式

    介绍 观察者模式又叫发布订阅模式(Publish/Subscribe),一个目标对象管理所有相依于它的观察者对象.该模式中存在两个角色:观察者和被观察者.目标对象与观察者之间的抽象耦合关系能够单独扩展 ...

  8. Javascript设计模式之我见:观察者模式

    大家好!本文介绍观察者模式及其在Javascript中的应用. 模式介绍 定义 定义对象间一种一对多的依赖关系,使得每当一个对象改变状态,则所有依赖于它的对象都会得到通知并被自动更新. 类图及说明 S ...

  9. [转] JavaScript设计模式之发布-订阅模式(观察者模式)-Part1

    <JavaScript设计模式与开发实践>读书笔记. 发布-订阅模式又叫观察者模式,它定义了对象之间的一种一对多的依赖关系.当一个对象的状态发生改变时,所有依赖它的对象都将得到通知. 例如 ...

随机推荐

  1. JS动态修改页面EasyUI datebox不生效、EasyUI动态添加Class、EasyUI动态渲染解析解决方案

    这是个小菜在实际工作中遇到的问题,相信很多EasyUI新手很可能也遇到这样的问题,因此小菜觉得有必要拿出来分享一下. 这个问题要从EasyUI的datebox组件说起,小菜用这个组件的时候,发现用$( ...

  2. jpa 注解使用说明

    1.@Entity(name="EntityName") 必须,name为可选,对应数据库中一的个表 2.@Table(name="",catalog=&quo ...

  3. JUnit 测试

    Junit 使用 1.忽略测试方法.在使用@Test的方法上使用@Ignore,将不会对此方法进行测试 2.测试套件 解决的问题: 1.对测试类进行统一测试,而不必在单独测试类上一个一个进行测试. 使 ...

  4. jenkins插件 查看job修改历史

    文章来自:http://www.ciandcd.com文中的代码来自可以从github下载: https://github.com/ciandcd 插件jobConfigHistory(https:/ ...

  5. ubuntu14.04中文楷体变默认字体

    使用ubuntu以来,最让人头疼的事情就是在英文系统里面使用中文,一般中文字体都很难看,要么有锯齿,要么就是楷体.经过网上搜索找到一堆方法.一个个尝试之后觉得以下方式是最简单有效的. 1.安装font ...

  6. SVM=LASSO?

    SVM和LASSO是机器学习里两个非常经典的模型,每个模型都有大量的文献进行研究.其中去年出版的这本书——<Regularization, Optimization, Kernels, and ...

  7. Atitit.dwr3 不能显示错误详细信息的解决方案,控件显示错误详细信息的解决方案 java .net php

    Atitit.dwr3 不能显示错误详细信息的解决方案,控件显示错误详细信息的解决方案 java .net php 1. Keyword/subtitle 1 2. 使用dwr3的异常convert处 ...

  8. mysql高级排序&高级匹配查询示例

    在大多数应用场景下,我们使用mysql进行查询时只会用到'=', '>' , '<' , in, like 等常用的方法,看起来,大多数情况下,已经足以应付我们的小型应用了.不过,在一些特 ...

  9. 更新日志 - fir.im 新版管理后台邀请内测

    上周,我们对fir.im 新版管理后台的页面结构和样式进行了优化,现在新版的管理后台开始邀请内测,感兴趣的伙伴可以发邮件到 **beta@fir.im** 申请.为了保证服务质量和对问题进行有效追踪, ...

  10. iOS开发-UITableView滑动视差

    视差滚动是指让多层背景以不同的速度移动,形成立体的运动效果,在Web上应用的比较多,App中倒是见的相对比较少,主要在UITableView中的应用的比较多,尤其是当整个UITableViewCell ...