发布 — 订阅模式又叫观察者模式,它定义对象间的一种一对多的依赖关系,当一个对象的状
态发生改变时,所有依赖于它的对象都将得到通知。在 JavaScript开发中,我们一般用事件模型
来替代传统的发布 — 订阅模式。

  1. var salesOffices = {}; // 定义售楼处
  2. salesOffices.clientList = []; // 缓存列表,存放订阅者的回调函数
  3. salesOffices.listen = function(fn) { // 增加订阅者
  4. this.clientList.push(fn); // 订阅的消息添加进缓存列表
  5. };
  6. salesOffices.trigger = function() { // 发布消息
  7. for(var i = 0, fn; fn = this.clientList[i++];) {
  8. fn.apply(this, arguments); // (2) // arguments 是发布消息时带上的参数
  9. }
  10. };
  11. // 下面我们来进行一些简单的测试:
  12. salesOffices.listen(function(price, squareMeter) { // 小明订阅消息
  13. console.log('价格= ' + price);
  14. console.log('squareMeter= ' + squareMeter);
  15. });
  16. salesOffices.listen(function(price, squareMeter) { // 小红订阅消息
  17. console.log('价格= ' + price);
  18.  
  19. console.log('squareMeter= ' + squareMeter);
  20. });
  21. salesOffices.trigger(2000000, 88); // 输出:200 万,88 平方米
  22. salesOffices.trigger(3000000, 110); // 输出:300 万,110 平方米

至此,我们已经实现了一个最简单的发布 — 订阅模式.

浅谈js设计模式之发布 — 订阅模式的更多相关文章

  1. js设计模式之发布/订阅模式模式

    一.前言 发布订阅模式,基于一个主题/事件通道,希望接收通知的对象(称为subscriber)通过自定义事件订阅主题,被激活事件的对象(称为publisher)通过发布主题事件的方式被通知. 就和用户 ...

  2. js设计模式之发布订阅模式

    1. 定义 发布-订阅模式其实是一种对象间一对多的依赖关系,当一个对象的状态发送改变时,所有依赖于它的对象都将得到状态改变的通知. 订阅者(Subscriber)把自己想订阅的事件注册(Subscri ...

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

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

  4. JS 设计模式八 -- 发布订阅者模式

    概念 发布---订阅模式又叫观察者模式,它定义了对象间的一种一对多(一个发布,多个观察)的关系,让多个观察者对象同时监听某一个主题对象,当一个对象发生改变时,所有依赖于它的对象都将得到通知. 优点 1 ...

  5. JS中的发布订阅模式

    一. 你是如何理解发布订阅模式的 JS中的设计模式: 单例模式:处理业务逻辑 构造原型模式:封装类库,组件,框架,插件等 类库:jQuery 只是提供了一些常用的方法,可以应用到任何的项目中,不具备业 ...

  6. JavaScript设计模式(发布订阅模式)

    发布—订阅模式又叫观察者模式,它定义对象间的一种一对多的依赖关系,当一个对象的状态发生改变时,所有依赖于它的对象都将得到通知.在JavaScript开发中,我们一般用事件模型来替代传统的发布—订阅模式 ...

  7. Javascript设计模式之发布-订阅模式

    简介 发布-订阅模式又叫做观察者模式,他定义了一种一对多的依赖关系,即当一个对象的状态发生改变的时候,所有依赖他的对象都会得到通知. 回忆曾经 作为一名前端开发人员,给DOM节点绑定事件可是再频繁不过 ...

  8. javascript中的设计模式之发布-订阅模式

    一.定义 又叫观察者模式,他定义对象间的依照那个一对多的依赖关系,当一个对象的状态发生改变时,所有依赖于它的对象都将的到通知.在javascript中,我们一般用时间模型来替代传统的发布-订阅模式 二 ...

  9. js里的发布订阅模式及vue里的事件订阅实现

    发布订阅模式(观察者模式) 发布订阅模式的定义:它定义对象间的一种一对多的依赖关系,当一个对象的状态发生改变时,所有依赖于它的对象都将得到通知. 发布订阅模式在JS中最常见的就是DOM的事件绑定与触发 ...

随机推荐

  1. 深入理解ajax系列第六篇——头部信息

    前面的话 每个HTTP请求和响应都会带有相应的头部信息,其中有的对开发人员有用.XHR对象提供了操作头部信息的方法.本文将详细介绍HTTP的头部信息 默认信息 默认情况下,在发送XHR请求的同时,还会 ...

  2. 【大数据】Scala学习笔记

    第 1 章 scala的概述1 1.1 学习sdala的原因 1 1.2 Scala语言诞生小故事 1 1.3 Scala 和 Java  以及 jvm 的关系分析图 2 1.4 Scala语言的特点 ...

  3. 【题解】 bzoj3105: [cqoi2013]新Nim游戏 (线性基+贪心)

    bzoj3105,懒得复制 Solution: 首先你要有一个前置技能:如果每堆石子异或和为\(0\),则先手比输 这题我们怎么做呢,因为我们没人要先取掉几堆,为了赢对方一定会使剩下的异或和为\(0\ ...

  4. 第一天进入博客这个神奇的领域 在此%%%erosun

    第一条博客水一水    等会要找一下调博客模板 独立动手,丰衣足食

  5. 【BZOJ1019】[SHOI2008]汉诺塔(数论,搜索)

    [BZOJ1019][SHOI2008]汉诺塔(数论,搜索) 题面 BZOJ 洛谷 题解 首先汉诺塔问题的递推式我们大力猜想一下一定会是形如\(f_i=kf_{i-1}+b\)的形式. 这个鬼玩意不好 ...

  6. 使用highlight.js高亮静态页面的语言代码

    显示静态的代码其实html的pre标签基本可以满足需求了,至少不会将换行的文本显示成一堆字符串. 不过能使静态的文本能高亮显示,倒更炫酷一点.其实很简单的,引入highlight.js包,可以使用cd ...

  7. EasyUI 格式化列

    以下实例格式化在 easyui DataGrid 里的列数据,并使用自定义列的 formatter,如果价格小于 20 就将文本变为红色. 为了格式化一个数据网格(DataGrid)列,我们需要设置 ...

  8. 以Java的视角来聊聊BIO、NIO与AIO的区别?

    转: 以Java的视角来聊聊BIO.NIO与AIO的区别? 飞丫玲丫 17-07-2623:10 题目:说一下BIO/AIO/NIO 有什么区别?及异步模式的用途和意义? BIO(Blocking I ...

  9. ThinkPHP5项目目录

    ThinkPHP5安装后(或者下载后的压缩文件解压后)可以看到下面的目录结构: tp5├─application     应用目录 ├─extend          扩展类库目录(可定义) ├─pu ...

  10. Kubernetes Service

    目录 基本概念 服务发现与负载均衡 配置Service 创建一个ClusterIP类型的Service 创建一个指定ClusterIP的Service 创建一个headless service 创建一 ...