js 实现发布订阅模式
/* 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 实现发布订阅模式的更多相关文章
- JS的发布订阅模式
JS的发布订阅模式 这里要说明一下什么是发布-订阅模式 发布-订阅模式里面包含了三个模块,发布者,订阅者和处理中心.这里处理中心相当于报刊办事大厅.发布者相当与某个杂志负责人,他来中心这注册一个的杂志 ...
- js设计模式-发布/订阅模式
一.前言 发布订阅模式,基于一个主题/事件通道,希望接收通知的对象(称为subscriber)通过自定义事件订阅主题,被激活事件的对象(称为publisher)通过发布主题事件的方式被通知. 就和用户 ...
- js设计模式--发布订阅模式
前言 本系列文章主要根据<JavaScript设计模式与开发实践>整理而来,其中会加入了一些自己的思考.希望对大家有所帮助. 概念 发布-订阅模式又叫观察者模式,它定义对象间的一种一对多的 ...
- [转]js设计模式—发布订阅模式
发布—订阅模式又叫观察者模式,它定义对象间的一对多的依赖关系,当一个对象的状态发生改变时,所有依赖于它的对象都将得到通知.在javascript开发中,一般用事件模型来替代传统的发布—订阅模式.本文将 ...
- JS中的发布订阅模式
一. 你是如何理解发布订阅模式的 JS中的设计模式: 单例模式:处理业务逻辑 构造原型模式:封装类库,组件,框架,插件等 类库:jQuery 只是提供了一些常用的方法,可以应用到任何的项目中,不具备业 ...
- 从发布订阅模式入手读懂Node.js的EventEmitter源码
前面一篇文章setTimeout和setImmediate到底谁先执行,本文让你彻底理解Event Loop详细讲解了浏览器和Node.js的异步API及其底层原理Event Loop.本文会讲一下不 ...
- js里的发布订阅模式及vue里的事件订阅实现
发布订阅模式(观察者模式) 发布订阅模式的定义:它定义对象间的一种一对多的依赖关系,当一个对象的状态发生改变时,所有依赖于它的对象都将得到通知. 发布订阅模式在JS中最常见的就是DOM的事件绑定与触发 ...
- 4.js模式-发布-订阅模式
1. 发布-订阅模式 var observe = (function(){ var events = {}, listen, trigger, remmove; listen = function(k ...
- JS设计模式(5)发布订阅模式
什么是发布订阅模式(观察者模式)? 定义:定义对象间的一种一对多的依赖关系,当一个对象的状态发生改变时,所有依赖于它的对象都得到通知并被自动更新. 主要解决:一个对象状态改变给其他对象通知的问题,而且 ...
随机推荐
- php标准库DirectoryIterator类的操作说明
<?php $dir = new DirectoryIterator(dirname(__FILE__)); foreach ($dir as $fileInfo) { if ($fileInf ...
- Java for LeetCode 137 Single Number II
Given an array of integers, every element appears three times except for one. Find that single one. ...
- Swift 烧脑体操(三) - 高阶函数
前言 Swift 其实比 Objective-C 复杂很多,相对于出生于上世纪 80 年代的 Objective-C 来说,Swift 融入了大量新特性.这也使得我们学习掌握这门语言变得相对来说更加困 ...
- Java里的阻塞队列
JDK7提供了7个阻塞队列,如下: ArrayBlockingQueue : 一个数组结构组成的有界阻塞队列. LinkedBlockingQueue : 一个由链表结构组成的有界阻塞队列 . Pr ...
- FastJson 输出值 首字母大小写问题
解决方案: 1. 如果你的项目由多个模块且为分布式部署, 则可考虑使用设置System.property 2. 一般只是极少数的代码出现此情况, 那么建议直接在你的单例Service初始化时, 在静态 ...
- IDT 信息设计工具使用
IDT 大多使用于接外系统数据,也就是非SAP 系统数据库.虽然SAP BW 里有数仓概念,接外部系统的视图.集中在使用建模,query ,再通过BO来展示.可是有些我们需要直连数据库,取一两张表相对 ...
- python基础-私有变量和方法
如果要让内部属性不被外部访问,可以把属性的名称前加上两个下划线__,在Python中,实例的变量名如果以__开头,就变成了一个私有变量(private),只有内部可以访问,外部不能访问 __priva ...
- Nginx均衡负载配置
前言:Nginx也是一种服务器,反向代理服务器.单一tomcat能承受的并发访问量在150-200之间,还是在比较理想的情况下,当并发量超出这个范围,便需要Nginx实现多个tomcat的均衡负载,但 ...
- 【LeetCode】027. Remove Element
题目: Given an array and a value, remove all instances of that value in place and return the new lengt ...
- js 图片上传
可能很多不熟悉的图片上传的同学会觉得有点懵,其实做过一次你就会发现特别的简单. 只是一个formData格式的表单提交,把地址写到 action = "" 里面就可以了,当然你可以 ...