//发布订阅模式
class EventEmiter{
constructor(){
//维护一个对象
this._events={ }
}
on(eventName,callback){
if( this._events[eventName]){
//如果有就放一个新的
this._events[eventName].push(callback);
}else{
//如果没有就创建一个数组
this._events[eventName]=[callback]
}
}
emit(eventName,...rest){
if(this._events[eventName]){ //循环一次执行
this._events[eventName].forEach((item)=>{
item.apply(this,rest)
});
}
}
removeListener(eventName,callback){
if(this._events[eventName]){
//当前数组和传递过来的callback相等则移除掉
this._events[eventName]=
this._events[eventName].filter(item=>item!==callback);
}
}
once(eventName,callback){
function one(){
//在one函数运行原来的函数,只有将one清空
callback.apply(this,arguments);
//先绑定 执行后再删除
this.removeListener(eventName,one);
}
this.on(eventName,one);
//此时emit触发会执行此函数,会给这个函数传递rest参数
}
}
class Man extends EventEmiter{}
let man=new Man()
function findGirl() {
console.log('找新的女朋友')
}
function saveMoney() {
console.log('省钱')
}
man.once('失恋',findGirl);
//man.on('失恋',findGirl) //失恋 ,绑定一个函数方法
man.on('失恋',saveMoney)//失恋 ,绑定一个函数方法
man.removeListener('失恋',saveMoney); //移除一个函数方法
man.emit('失恋');
//绑定一次,触发多次,也只执行一次。触发后一次将数组中的哪一项删除掉下次触发就不会执行

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

  1. js发布订阅模式实现

    //可以用于无相关页面或组件的事件.数据传递,减少在onShow中的业务,降低代码耦合 let events = {} /**订阅**/ function on(name, self, callbac ...

  2. node.js 发布订阅模式

    //导入内置模块 let EventEmitter = require('events'); let util=require('util'); //Man继承EventEmitter util.in ...

  3. JS的发布订阅模式

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

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

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

  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. Linux day01(二)虚拟机快照和克隆的用法介绍

    一:快照 优点:运行虚拟机后不用担心系统会被弄崩溃了,点击快照会立即恢复到初始状态 缺点:回滚会带来数据的丢失,所以要考虑数据恢复的成本和找回数据时进行操作的成本 1. 在导航栏中找虚拟机快照的小图标 ...

  2. (快排)51NOD 1018 排序

    给出N个整数,对着N个整数进行排序   Input 第1行:整数的数量N(1 <= N <= 50000) 第2 - N + 1行:待排序的整数(-10^9 <= A[i] < ...

  3. WebSphere设置会话超时时间

    WebSphere Application Server的会话超时时间可以在三个层面进行设置,分别为:应用程序服务器级别.应用程序级别和代码层面进行设置. 设置方式:应用程序级别级别和应用级别可以通过 ...

  4. datagrid 选中某行,翻页再翻回来,发现选中的行没有选中

    不管有没有设置复选框,其实都是一样的,都是idField属性没有设置,加上去即可. $(function(){ $('#dg').datagrid({ url:'ContactServlet', to ...

  5. python __slots__ 详解(上篇)

    转自:http://blog.csdn.net/sxingming/article/details/52892640 python中的new-style class要求继承Python中的一个内建类型 ...

  6. [Android]异常3-java.lang.NoClassDefFoundError: javax.activation.DataHandler

    背景:JavaMail发送电子邮件 异常原因: 可能一>缺少DataHandler类相关jar包 可能二>有DataHandler类,DataHandler类与使用的mail.jar包不一 ...

  7. NX自动出图 发布啦

    经过4个月的努力,终于面世啦!!!!1.安装文件 :http://yunpan.cn/Q49TWSJmy2i5Z    请下载后,按照“安装说明.txt ”进行安装!2.学习视频:http://yun ...

  8. Hibernate框架之Criteria 详解

    自从学数据库以来,从SQL查询-HQL查询-到Criteria 查询.有人问我:掌握一种查询语句不就可以吗,为什么还要学Criteria 查询?我回答道:用到特定于数据库的SQL 语句,程序本身会依赖 ...

  9. 3星|《投机教父尼德霍夫的股票投机术》:2003年的书了。作者97年投机大亏后在CNBC《金钱》栏目上的股市评论文章集。

    查资料作者在97年金融危机中大亏,之后在CNBC<金钱>栏目上跟人合写股市评论文章,本书是那些股评文章的集合.有资料说作者在08年有一次大亏. 从这些文章看,作者是比较冷静地看待股市的,不 ...

  10. BackboneJS and UnderscoreJS

     介绍 来自API(backbone能做什么?) 当我们开发含有大量Javascript的web应用程序时,首先你需要做的事情之一便是停止向DOM对象附加数据. 通过复杂多变的jQuery选择符和回调 ...