1      var Event = {
 2             on: function (eventName, callback) {
 3                 console.log("eventName:"+eventName)
 4                 if (!this.handles) {
 5                     Object.defineProperty(this, "handles", {
 6                         value: {},
 7                         enumerable: false//不可枚举
 8                     })
 9                     //this.handles = {};//可以枚举
10                 }
11                 if (!this.handles[eventName]) {
12                     this.handles[eventName] = [];
13                 }
14                 this.handles[eventName].push(callback);
15             },
16             emit: function () {
17                 var hlist = this.handles[arguments[0]] || [];
18                 for (var i = 0; i < hlist.length; i++) {
19                     this.handles[arguments[0]][i](arguments[1]);
20                 }
21             }
22         }
23         Event.on("dome", function (params) {
24             console.log(params);
25         });
26         Event.on("dome", function (params) {
27             console.log("dome log");
28         });
29         Event.emit("dome", "holle world");
30
31         var person1 = {};
32         var person2 = {};
33         //Object.assign是浅复制,会导致person1,person2共用同一个handles
34         Object.assign(person1, Event);
35         Object.assign(person2, Event);
36         person1.on('call1', function () {
37             console.log('person1');
38         });
39         person2.on('call2', function () {
40             console.log('person2');
41         });
42         person1.emit('call1'); // 输出 'person1'
43         person1.emit('call2'); // 没有输出
44         person2.emit('call1'); // 没有输出
45         person2.emit('call2'); // 输出 'person2'

转载于:https://www.cnblogs.com/cn2758/p/8079043.html

JS的自定义事件(观察者模式)相关推荐

  1. html 自定义js,js 自定义事件

    js怎么自定义事件,并能让用on事件监听 你这个问题全部内容应该是如下吧: 在视频播放的时候,能够用on监听事件的触发,如下: player.on('pause',function(){ consol ...

  2. Vue组件及自定义事件

    目录 Vue.js 组件 动态 Prop Prop 验证 Vue.js 组件 - 自定义事件 data 必须是一个函数

  3. 观察者模式和js自定义事件

    事件是一种叫做观察者的设计模式,观察者模式由两类对象组成:主体和观察者.主体负责发布事件,同时观察者通过订阅这些事件来观察该主体.拿DOM来说,DOM就是主体,事件处理代码便是观察者. 下面是一个自定 ...

  4. JS基础-事件模型(事件事件流自定义事件事件冒泡/代理)

    文章目录 一.事件与事件流 二.事件模型 1.DOM0级模型 2.IE事件模型 3.DOM2级模型 4.DOM3级事件处理方式 三.事件对象 四.事件绑定与解除 1.事件绑定 1.1对象.on事件名字 ...

  5. 【JS】512- JS 自定义事件如此简单!

    在前端开发世界中,JavaScript 和 HTML 之间往往通过 事件 来实现交互.其中多数为内置事件,本文主要介绍 JS自定义事件概念和实现方式,并结合案例详细分析自定义事件的原理.功能.应用及注 ...

  6. 使用 JS 关闭警告框及监听自定义事件(amaze ui)

    使用 JS 关闭警告框及监听自定义事件(amaze ui) 一.总结 1.jquery匿名函数:第8行,jquery匿名函数,$(function(){});,有没有很简单,只是少了jquery的前面 ...

  7. html 自动触发 事件,js自动触发事件自定义事件

    在有些情况下,我们需要程序逻辑自动触发元素的事件,例如js提供了click(), form提供了reset(),submit()等方法!在jquery中提供了trigger()方法帮助我们自动触发事件 ...

  8. vue中 点击事件的写法_vue中的事件:原生事件与自定义事件__Vue.js

    模板编译 processAttrs 对于ast attributes处理(v-on/@) 利用onRE与dirRE来捕获事件 这里最重要的就是dynamic的判断,vue中可以用动态参数来命名事件名称 ...

  9. Node.js: 如何继承 events 自定义事件及触发函数

    events 是node.js的核心api ,几乎大部分node.js 的api都继承 events 类(javascript中没有类,也不存在继承,确切说是模拟类和继承,点击查看) 比如我们常见的 ...

最新文章

  1. pytorch 自定义参数不更新
  2. PAT甲级1017 Queueing at Bank:[C++题解]字符串、结构体、最小堆
  3. Linux工作笔记-Linux常用命令(一)
  4. github推荐好玩项目
  5. 三天打鱼两天晒网 (15 分)
  6. MUI框架开发HTML5手机APP
  7. [转]McAfee 病毒库最新离线升级包下载 VirusScan SuperDAT
  8. Win 10提升隐藏性能
  9. 【数据结构--二叉树】--附超详细图解
  10. 新浪微博的Tab滑动效果
  11. win10,在proe/creo中鼠标中键不能放大缩小
  12. 关于Bootstrap 中使用Tooltips不生效的问题
  13. If python is on the left-most side of the chain, that‘s the version you‘ve asked for.
  14. Android锁屏的实现与难点总结
  15. flatten(扁平化)数组
  16. 英语六级(包含作文)
  17. yarn : 无法加载文件 C:\Users\HYGK\AppData\Roaming\npm\yarn.ps1,因为在此系统上禁止运行脚本。有关详细信息,请参阅 https:/go.microsof
  18. Hibernate学习-14:实体之间的关系及其配置,级联操作
  19. 目标检测——RCNN与YOLO系列
  20. 计算机软件过期黑屏怎么办,Adobe flashplayer过期怎么办

热门文章

  1. mysql 索引 lt =,当同时使用gt; =和lt; =时如何索引MySQL表?
  2. tornado服务器动态文件,tornado 实现服务器消息推送功能
  3. python def函数报错详解_Python函数详解
  4. python对数据进行分类_在Python中对一系列数据进行分类的最佳方法
  5. arggis怎么修改上下标_京东自营是怎么操作的?有什么要求?
  6. Linux目录遍历实现,列出目录下文件,可使用部分参数
  7. 【IT笔试面试题整理】数组中出现次数超过一半的数字
  8. verilog 不可综合语句 总结 汇总(Z)
  9. C++笔记——指向常量的指针/指针常量
  10. 爬虫goodreads数据_使用Python从Goodreads数据中预测好书