本文简单叙述下javascript是如何建立一个Emitter构造函数的。

/**
*  定义Emitter构造函数
*/function Emitter() {}/**
*  添加监听事件
*/Emitter.prototype.on =
Emitter.prototype.addEventListener = function(event, fn){this._callbacks = this.callbacks || {};(this._callbacks[event] = this._callbacks[event] || []).push(fn);return this;
}
/***  添加一个一次性监听事件*/

Emitter.prototype.once = function(event, fn){  var self = this;  this._callbacks = this._callbacks || {};

  function on() {    self.off(event, on);    fn.apply(this, arguments);  }

  on.fn = fn;  this.on(event, on);  return this;};

/***  移除已经添加的监听事件*/

Emitter.prototype.off =Emitter.prototype.removeListener = Emitter.prototype.removeAllListeners =Emitter.prototype.removeEventListener = function(event, fn){  this._callbacks = this._callbacks || {};

  //  所有事件  if (0 == arguments.length) {    this._callbacks = {};    return this;  }

  //  指定事件  var callbacks = this._callbacks[event];  if (!callbacks) return this;

  // 移除对应的事件回调  if (1 == arguments.length) {    delete this._callbacks[event];    return this;  }

  var cb;  for (var i = 0l i< callbacks.length; i++) {    cb = callbacks[i];    if (cb === fn || cb.fn === fn) {      callbacks.splice(i, 1);      break;    }  }  return this;};

/***  手动触发指定event事件*/

Emitter.prototype.emit = function(event){  this._callbacks = this._callbacks || {};  var args = [].slice.call(arguments, 1),      callbacks = this._callbacks[event];  if (callbacks) {    callbacks = callbacks.slice(0);    for (var i = 0, len = callbacks.length; i< len; i++){      callbacks[i].apply(this, args);    }  }

  return this;};

/***  返回指定event的回调数组*/

Emitter.prototype.listeners = function(event){  this._callbacks = this._callbacks || {};  return this._callbacks[event] || [];};

/***  判断该Emitter是否有指定event的回调*/

Emitter.prototype.hasListeners = function(event){  return !!this.listeners(event).length;};

第一次写javascript分析,写下来还是发现有好多蹩脚的名字翻译,说明以后还是得多多练习才是。

转载于:https://www.cnblogs.com/jsfun/p/5990086.html

javscript创建Emitter相关推荐

  1. javscript 创建类的三种方法【转】

    http://www.ruanyifeng.com/blog/2012/07/three_ways_to_define_a_javascript_class.html 转载于:https://www. ...

  2. 百度地图精确定位html,HTML5地理定位,百度地图API,知识点熟悉

    深入seajs源码系列三 入口方法 每个程序都有个入口方法,类似于c的main函数,seajs也不例外.系列一的demo在首页使用了seajs.use(),这便是入口方法.入口方法可以接受2个参数,第 ...

  3. 手把手教你用Vue.js封装Form组件

    前言: 在日常使用vue开发WEB项目中,经常会有提交表单的需求.我们可以使用 iview 或者 element 等组件库来完成相关需求:但我们往往忽略了其中的实现逻辑,如果想深入了解其中的实现细节, ...

  4. iOS动画:粒子发射器(20)

    我们来实现这种下雪的粒子效果 要创建粒子发射器的动画,需要用到一个新的layer:CAEmitterLayer 在viewDidLoad中创建emitter对象 let rect = CGRect(x ...

  5. 三郎前端特效学习源代码:魔法旋转粒子动态渐变特效

    三郎前端特效学习源代码:魔法旋转粒子动态渐变特效 简单介绍 效果图 源代码 html部分 js部分 第二个js部分 简单介绍 类似电影里的魔法效果 轨迹次数速度都可以自己改改 效果图 源代码 html ...

  6. Flink 源码解析--Async IO的实现

    在使用Flink处理实时数据流时,经常需要和外部系统进行交互.例如,在构建实时数据仓库的时候,通常需要将消息和外部维表进行关联,以获得额外的维度数据.由于外部系统的响应时间和网络延迟可能会很高,如果采 ...

  7. git的详细用法和基础教程

    Git 是当前最流行的版本控制程序之一,文本包含了 Git 的一些基本用法 创建 git 仓库 初始化 git 仓库 mkdir project  # 创建项目目录  cd project  # 进入 ...

  8. IOS 粒子发射器,雪花落下、创建火焰、河流、蒸汽的动画效果源代码

    学习神奇的粒子发射器,雪花纷纷落下的动画效果,就是通过CAEmitterLayer来实现的,这个layer还能创建火焰,河流,蒸汽的动画效果,常用于游戏开发. 原文来自code4app http:// ...

  9. 如何使用React和Redux前端创建Rails项目

    by Mark Hopson 马克·霍普森(Mark Hopson) 如何使用React和Redux前端(加上Typescript!)创建Rails项目 (How to create a Rails ...

  10. [react] 怎样在react中创建一个事件?

    [react] 怎样在react中创建一个事件? var EventEmitter = require('events').EventEmitter; class App extends Compon ...

最新文章

  1. JDK 源码 Integer解读之一(toString)
  2. 熊猫数据集_用熊猫掌握数据聚合
  3. WPF:使用WPF应用程序中的默认网络凭据和凭据存储来管理自动登录
  4. pytorch torchvision.transforms.CenterCrop
  5. 析构函数无法命中断点. 当前无法命中断点: 没有与此行关联的调试程序的目标代码类型的可执行代码. 可能的原因包括;条件编译, 编译器优化或者......
  6. 域管理员在域计算机安装程序,本人电脑菜鸟,现在正用管理员用户登录,如何设置某个域用户拥有安装软件的权限?尽量详解。谢谢!...
  7. LINQ语法之into
  8. 传智播客扫地僧C/C++学习 数据类型的本质
  9. 《程序员面试宝典》.pdf
  10. 系列课程 ElasticSearch 之第 8 篇 —— SpringBoot 整合 ElasticSearch 做查询(分页查询)
  11. Java图形界面编程--漫天繁星
  12. IT项目经理的基本条件
  13. Unix/Linux编程:exec()族函数
  14. 华硕飞行堡垒 新机子安装双系统 linux
  15. ios swift收起键盘
  16. XJOI 数组-炸弹
  17. MEDLINE与PubMed有什么区别?检索范围包含哪些?
  18. 连环画教科书,电子版微积分
  19. 由真值表求逻辑表达式的方法
  20. 底盘电控系统仿真测试解决方案

热门文章

  1. 常成员函数和静态成员函数
  2. BI工具和数据中台有什么区别?
  3. 提高工作效率的工具[分享]
  4. C语言交换a,b值的几种写法
  5. Android初级教程 - 四大存储之SP存储
  6. 小熊派BearPi-HM nano开发板 -- MobaXterm使用详情、VScode连接编译主机、小熊派源码获取及烧录
  7. LEAK: ByteBuf.release() was not called before it‘s garbage-collected
  8. 【Kepware与S71500连接 返回协议错误0X81解决方案】
  9. 与传统的物理服务器对比,云服务器有哪些优势
  10. 研究生实证论文数据经验分享