http://www.cnblogs.com/surahe/p/6065778.html

 发布—订阅模式可以广泛应用于异步编程中,这是一种替代传递回调函数的方案。比如,我们可以订阅 ajax 请求的 error 、 succ 等事件。 或者如果想在动画的每一帧完成之后做一些事情,那我们可以订阅一个事件,然后在动画的每一帧完成之后发布这个事件。在异步编程中使用发布—订阅模式,我们就无需过多关注对象在异步运行期间的内部状态,而只需要订阅感兴趣的事件发生点。

  发布—订阅模式可以取代对象之间硬编码的通知机制,一个对象不用再显式地调用另外一个对象的某个接口。发布—订阅模式让两个对象松耦合地联系在一起,虽然不太清楚彼此的细节,但这不影响它们之间相互通信。当有新的订阅者出现时,发布者的代码不需要任何修改;同样发布者需要改变时,也不会影响到之前的订阅者。只要之前约定的事件名没有变化,就可以自由地改变它们。

<script>
     var salesOffices = {};
     salesOffices.clientList = [];

     salesOffices.listen = function(key, fn) {
         if (!this.clientList[key]) {
             this.clientList[key] = [];
         }
         this.clientList[key].push(fn);
    };

    salesOffices.trigger = function() {
        var key = Array.prototype.shift.call(arguments),
                fns = this.clientList[key];
        if (!fns || fns.length === 0) {
            return false;
        }
        for (var i=0, fn; fn=fns[i++];) {
            fn.apply(this, arguments);
        }
    };

    salesOffices.listen('squareMeters88', function(price, squareMeter) {
        console.log('price is :' + price);
        console.log('squareMeter: ' + squareMeter);
    });

    salesOffices.listen('squareMeters110', function(price, squareMeter) {
        console.log('price is :' + price);
        console.log('squareMeter: ' + squareMeter);
    });

    console.log(salesOffices);
    salesOffices.trigger('squareMeters88', 20000, 88);
    salesOffices.trigger('squareMeters110', 30000, 110);

</script>

用原生javascript实现最简单的发布者-订阅者模式的更多相关文章

  1. JavaScript 设计模式: 发布者-订阅者模式

    JavaScript 设计模式: 发布者-订阅者模式 发布者-订阅者模式 https://github.com/Kelichao/javascript.basics/issues/22 https:/ ...

  2. vue双向绑定(数据劫持+发布者-订阅者模式)

    参考文献:https://www.cnblogs.com/libin-1/p/6893712.html 实现mvvm主要包含两个方面,数据变化更新视图,视图变化更新数据. 关键点在于data如何更新v ...

  3. C#事件支持发布者/订阅者模式(观察者模式)

    C#事件支持发布者/订阅者模式,发布者将事件通知给订阅者,而订阅者在事件发生时调用已经注册好的事件处理函数.        public delegate void delUpdate();  //委 ...

  4. EventBus事件总线框架(发布者/订阅者模式,观察者模式)

    一. android应用内消息传递的方式: 1. handler方式-----------------不同线程间传递消息. 2. Interface接口回调方式-------任意两个对象. 3. In ...

  5. 用原生JavaScript做个简单的回到顶部

    很多网页在下方都会放置一个“返回顶部”按钮,尤其是页面底部没有导航的网页,这样可以帮助访客重新找到导航或者重温一遍广告(想得真美).随着近几年来 JavaScript 的应用日渐广泛,滑动效果无处不在 ...

  6. 原生JavaScript实现一个简单的todo-list

    直接上代码: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UT ...

  7. Javascript模式(二) 发布者/订阅者模式

    var publisher = { // 订阅者数组 subscribers : { "any" : [] }, // 增加订阅者 on : function(type, fn, ...

  8. 发布者订阅者模式之JAVA实现

        1.发布者接口 package com.shoshana.publishsubscribe; public interface IPublisher<M> { public voi ...

  9. js中的观察者模式与发布者/订阅者模式的区别?

随机推荐

  1. getElementByName????????,????????,

    getElementByName可以获取多个元素,获得的是一个数组, getElementById只能获取一个,是dom从上往下的第一个元素.

  2. 将有效慢日志转存到数据库v2

    import re import sys import getopt import MySQLdb from subprocess import call import os host='10.76. ...

  3. 《Cracking the Coding Interview》——第4章:树和图——题目5

    2014-03-19 04:11 题目:设计算法检查一棵二叉树是否为二叉搜索树. 解法:既然是二叉搜索树,也就是说左子树所有节点都小于根,右子树所有节点都大于根.如果你真的全都检查的话,那就做了很多重 ...

  4. USACO Section1.5 Prime Palindromes 解题报告

    pprime解题报告 —— icedream61 博客园(转载请注明出处)--------------------------------------------------------------- ...

  5. freemaker示例

    第一步  创建一个User.java文件 来两个变量 public class User {      private String userName;       private String us ...

  6. 百度webuploader上传 1

    百度webupload网址:http://fex.baidu.com/webuploader/ 引入js和css <script src="../../Content/webuploa ...

  7. elk-filebeat收集docker容器日志

    目录 使用docker搭建elk filebeat安装与配置 docker容器设置 参考文章 首发地址 使用docker搭建elk 1.使用docker-compose文件构建elk.文件如下: ve ...

  8. shell中的>&1和 >&2是什么意思?

    当初在shell中, 看到">&1"和">&2"始终不明白什么意思.经过在网上的搜索得以解惑.其实这是两种输出. 在 shell 程 ...

  9. Qt-Creator 加入qwt库

    qwt是基于Qt的开源图表库 从官网下载qwt的源码 http://sourceforge.jp/projects/sfnet_qwt/downloads/qwt/6.1.0/qwt-6.1.0.ta ...

  10. 详解Django-auth-ldap 配置方法

    使用场景 公司内部使用Django作为后端服务框架的Web服务,当需要使用公司内部搭建的Ldap 或者 Windows 的AD服务器作为Web登录认证系统时,就需要这个Django-auth-ldap ...