/* Pubsub */
function Pubsub(){
  //存放事件和对应的处理方法
  this.handles = {};
} Pubsub.prototype = {
  //传入事件类型type和事件处理handle
  on: function (type, handle) {
    if(!this.handles[type]){
      this.handles[type] = [];
    }
    this.handles[type].push(handle);
  },
  emit: function () {
    //通过传入参数获取事件类型
    //将arguments转为真数组
    var type = Array.prototype.shift.call(arguments);
    if(!this.handles[type]){
      return false;
    }
    for (var i = 0; i < this.handles[type].length; i++) {
      var handle = this.handles[type][i];
      //执行事件
      handle.apply(this, arguments);
    }
  },
  off: function (type, handle) {
    handles = this.handles[type];
    if(handles){
      if(!handle){
        handles.length = 0;//清空数组
      }else{
      for (var i = 0; i < handles.length; i++) {
        var _handle = handles[i];
        if(_handle === handle){
          //从数组中删除
          handles.splice(i,1);
        }
      }
    }
  }  
} let p1 = new Pubsub();
p1.on('detail', (name)=> {console.log(name)});
p1.emit('detail', 'observer')
let p2 = new Pubsub();
p2.on('detail', (name)=> {console.log(name)});
p2.emit('detail', 'observer2')
p2.off('detail');
p2.emit('detail', 'observer3');

转自 https://segmentfault.com/a/1190000012430769

js 实现发布订阅模式的更多相关文章

  1. JS的发布订阅模式

    JS的发布订阅模式 这里要说明一下什么是发布-订阅模式 发布-订阅模式里面包含了三个模块,发布者,订阅者和处理中心.这里处理中心相当于报刊办事大厅.发布者相当与某个杂志负责人,他来中心这注册一个的杂志 ...

  2. js设计模式-发布/订阅模式

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

  3. js设计模式--发布订阅模式

    前言 本系列文章主要根据<JavaScript设计模式与开发实践>整理而来,其中会加入了一些自己的思考.希望对大家有所帮助. 概念 发布-订阅模式又叫观察者模式,它定义对象间的一种一对多的 ...

  4. [转]js设计模式—发布订阅模式

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

  5. JS中的发布订阅模式

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

  6. 从发布订阅模式入手读懂Node.js的EventEmitter源码

    前面一篇文章setTimeout和setImmediate到底谁先执行,本文让你彻底理解Event Loop详细讲解了浏览器和Node.js的异步API及其底层原理Event Loop.本文会讲一下不 ...

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

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

  8. 4.js模式-发布-订阅模式

    1. 发布-订阅模式 var observe = (function(){ var events = {}, listen, trigger, remmove; listen = function(k ...

  9. JS设计模式(5)发布订阅模式

    什么是发布订阅模式(观察者模式)? 定义:定义对象间的一种一对多的依赖关系,当一个对象的状态发生改变时,所有依赖于它的对象都得到通知并被自动更新. 主要解决:一个对象状态改变给其他对象通知的问题,而且 ...

随机推荐

  1. python get post模拟请求

    1.使用get方式时.url相似例如以下格式: &op=bind   GET报问头例如以下: &n=asa HTTP/1.1    Accept: */*    Accept-Lang ...

  2. Oracle伪列rownum

    Oracle基础知识:伪列rownum,伪列就像表中的列一样,但是在表中并不存储.伪列只能查询,不能进行增删改操作. 在查询的结果集中,ROWNUM为结果集中每一行标识一个行号,第一行返回1,第二行返 ...

  3. API的理解和使用——全局命令

    全局命令 命令 功能 set 创建键值对 keys 遍历查看所有键 exists 判断一个键是否存在,1存在,0不存在 dbsize 当前数据库中有多少个键 del 删除一个或多个键 expire 设 ...

  4. linux复制和移动

    复制: -f  强制覆盖同名文件 -r  按递归方式保留原目录结构复制文件 cp -Rf /home/user1/*   /root/temp/ 将/home/user1目录下的所有东西拷到/root ...

  5. curl下载安装

    curl下载地址 https://curl.haxx.se/download.html 选择windows generic 下的 下载安装 安装完后解压配置系统环境变量 CURL_HOME      ...

  6. MVC常见错误记录

    1 找到了多个与名为“Home”的控制器匹配的类型.如果为此请求(“{controller}/{action}/{id}”)提供服务的路由没有指定命名空间来搜索匹配此请求的 根项目下的RouteCon ...

  7. 算法(Algorithms)第4版 练习 1.3.9

    主要思路: 用Dijkstra的双栈算法. 遇到数字则压入数字栈中(String). 遇到运算符则压入运算符栈中(String). 遇到右括号时,从数字栈和运算法栈中弹出相应的元素,生成相应的运算表达 ...

  8. h5打电话发短信写邮件怎么实现

    // 一.打电话<a href="tel:0755-10086">打电话给:0755-10086</a> // 二.发短信,winphone系统无效< ...

  9. B1/B2签证的有效期——对于B1/B2签证,停留期最长不超过183天

    一.关于签证有效期首先我们要知道当我们历经困难从签证官手里拿到自己的签证的时候,签证上面有个时间这个我们叫做签证有效期.B1/B2一般是一年多次往返的,这个只跟你申请的签证类型有关,与你填表的时候写的 ...

  10. skynet实践(9)-随机数重复问题

    最近在使用skynet的过程中,遇到需要为玩家的每次请求产生一个随机序列的场景.简化如下: main.lua中每隔1S便发出一次随机数请求: local skynet = require " ...