js 发布订阅模式的实例讲解


Posted in Javascript onSeptember 10, 2017

废话不多说,直接上代码

//发布订阅模式
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 发布订阅模式的实例讲解就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
Javascript this关键字使用分析
Oct 21 Javascript
js中关于new Object时传参的一些细节分析
Mar 13 Javascript
基于jquery实现的一个选择中国大学的弹框 (数据、步骤、代码)
Jul 26 Javascript
JavaScript中的全局对象介绍
Jan 01 Javascript
Javascript字符串常用方法详解
Jul 21 Javascript
Angular2 自定义validators的实现方法
Jul 05 Javascript
vue父组件中获取子组件中的数据(实例讲解)
Sep 27 Javascript
jQuery中extend函数简单用法示例
Oct 11 jQuery
详解js的作用域、预解析机制
Feb 05 Javascript
微信小程序实现验证码获取倒计时效果
Feb 08 Javascript
浅谈Node.js 沙箱环境
May 15 Javascript
JavaScript使用闭包模仿块级作用域操作示例
Jan 21 Javascript
node.js 发布订阅模式的实例
Sep 10 #Javascript
基于node.js的fs核心模块读写文件操作(实例讲解)
Sep 10 #Javascript
深入浅出webpack教程系列_安装与基本打包用法和命令参数详解
Sep 10 #Javascript
基于AngularJS的简单使用详解
Sep 10 #Javascript
JS获取字符对应的ASCII码实例
Sep 10 #Javascript
Angular4学习笔记之根模块与Ng模块
Sep 09 #Javascript
关于vue-router的beforeEach无限循环的问题解决
Sep 09 #Javascript
You might like
DC宇宙的第一个英雄,堪称动漫史鼻祖,如今成为美国文化的象征
2020/04/09 欧美动漫
鸡肋的PHP单例模式应用详解
2013/06/03 PHP
CodeIgniter CLI模式简介
2014/06/17 PHP
浅谈php中urlencode与rawurlencode的区别
2016/09/05 PHP
PHP实现的迪科斯彻(Dijkstra)最短路径算法实例
2017/09/16 PHP
出现“不能执行已释放的Script代码”错误的原因及解决办法
2007/08/29 Javascript
jQuery 一个图片切换的插件
2011/10/09 Javascript
JQUERY1.6 使用方法四 检测浏览器
2011/11/23 Javascript
使用Mootools动态添加Css样式表代码,兼容各浏览器
2011/12/12 Javascript
javascript中自定义对象的属性方法分享
2013/07/12 Javascript
layer实现弹窗提交信息
2016/12/12 Javascript
php输出全部gb2312编码内的汉字方法
2017/03/04 Javascript
vue.js路由跳转详解
2017/08/28 Javascript
Webpack devServer中的 proxy 实现跨域的解决
2018/06/15 Javascript
浅谈vue项目4rs vue-router上线后history模式遇到的坑
2018/09/27 Javascript
nvm、nrm、npm 安装和使用详解(小结)
2019/01/17 Javascript
vue webpack重写cookie路径的方法
2019/07/10 Javascript
使用VueCli3+TypeScript+Vuex一步步构建todoList的方法
2019/07/25 Javascript
JS实现点击下拉列表文本框中出现对应的网址,点击跳转按钮实现跳转
2019/11/25 Javascript
在Python中使用NLTK库实现对词干的提取的教程
2015/04/08 Python
Python使用smtp和pop简单收发邮件完整实例
2018/01/09 Python
解决pycharm无法调用pip安装的包问题
2018/05/18 Python
Flask模拟实现CSRF攻击的方法
2018/07/24 Python
Python模拟浏览器上传文件脚本的方法(Multipart/form-data格式)
2018/10/22 Python
python根据list重命名文件夹里的所有文件实例
2018/10/25 Python
Python分支语句与循环语句应用实例分析
2019/05/07 Python
centos 安装Python3 及对应的pip教程详解
2019/06/28 Python
如何安装并使用conda指令管理python环境
2019/07/10 Python
如何将PySpark导入Python的放实现(2种)
2020/04/26 Python
python 实现Requests发送带cookies的请求
2021/02/08 Python
资产评估专业大学生求职信
2013/09/29 职场文书
高中毕业的自我鉴定
2013/12/09 职场文书
法定代表人授权委托书
2014/04/04 职场文书
车辆转让协议书
2014/09/24 职场文书
大学生支教感言
2015/08/01 职场文书
Python基础之元类详解
2021/04/29 Python