50、JavaScript里面，自定义事件的简单实现（事件队列的简单实现）

悠悠 2022-09-24 15:17 2阅读 0赞

1、JavaScript里面，自定义事件的简单实现（事件队列的简单实现）

2、实现的代码

var Event = {
    					on: function(eventName, callback) {
    						//下面的两个undefined的判断很重要
    						//保证了，动态的初始化了，对象的属性
    						if(typeof Event.handlers == "undefined") {
    							Event.handlers = {};
    						}
    						if(typeof Event.handlers[eventName] == "undefined") {
    							Event.handlers[eventName] = [];
    						}
    						Event.handlers[eventName].push(callback);
    
    					},
    					emit: function(eventName) {
    						//只有含有这个，时间的时候，才会调用回调函数
    						if(Event.handlers[eventName] instanceof Array) {
    							var handler = Event.handlers[eventName];
    							for(var i = 0, len = handler.length; i < len; i++) {
    								handler[i](arguments[1]);
    							}
    						}
    
    					},
    					removeHandler: function(type, handler) {
    						if(Event.handlers[type] instanceof Array) {
    							var handlers = Event.handlers[type];
    							for(var i = 0, len = handlers.length; i < len; i++) {
    								if(handlers[i] === handler) {
    									break;
    								}
    							}
    							handlers.splice(i, 1);
    						}
    					}
    
    				}

3、测试代码

function a(result) {
    				console.log(result);
    			}
    
    			function b() {
    				console.log('test');
    			}
    			Event.on('test', a);
    			Event.on('test', b);
    			//Event.removeHandler('test', b);			
    			Event.emit('test', 'hello world');

发表评论取消回复

表情：

评论列表（有 0 条评论，2人围观）

还没有评论，来说两句吧...

相关阅读

相关带有事件的简单 Javascript 日历

欢迎来到关于如何创建简单的纯 Javascript 日历的教程。您是否希望在不使用任何服务器端脚本的情况下开发日历 Web 应用程序？无论是商业项目、学校项目还是只是出于好奇—

梦里梦外;/ 2023年09月28日 08:36/ 0 赞/ 130 阅读

相关栈与队列的简单实现与应用

实验内容： 1.建立一个空栈 ![在这里插入图片描述][20200724123348237.png] 2.对已建立的栈进行插入、删除、取栈顶元素等操作插入：

￡神魔★判官ぃ/ 2023年03月01日 10:48/ 0 赞/ 245 阅读

相关 JavaScript如何自定义事件

什么是自定义事件在日常开发中，我们习惯监听页面许多事件，诸如：点击事件（ `click` ）、鼠标移动事件（ `mousemove` ）、元素失去焦点事件（ `blur

谁借莪１个温暖的怀抱￠/ 2022年10月17日 05:56/ 0 赞/ 190 阅读

相关 50、JavaScript里面，自定义事件的简单实现（事件队列的简单实现）

1、JavaScript里面，自定义事件的简单实现（事件队列的简单实现） 2、实现的代码 var Event = { on: functio

悠悠/ 2022年09月24日 15:17/ 0 赞/ 3 阅读

相关 C#自定义事件实现简介

目标：通过一个实例来按步骤说明C\自定义事件如何创建，引发，接收和取消。例子是一个窗体程序，一个按钮和一个标签，点击按钮的时候就触发一个事件得到当前时间，如果秒是后30秒就输出

喜欢ヅ旅行/ 2022年09月19日 13:28/ 0 赞/ 191 阅读

相关 C# 实现自定义事件

代码中实现了三个自定义事件，分别为自定义事件、自定义事件及自定义参数、使用Action自定义事件。 using System;using System.Col

心已赠人/ 2022年09月19日 12:29/ 0 赞/ 180 阅读

相关 [数据结构]队列的C语言简单实现

Github:([https://github.com/FlameCharmander/DataStructure][https_github.com_FlameCharman

╰+攻爆jí腚メ/ 2022年06月05日 04:22/ 0 赞/ 317 阅读

相关数据结构之队列的定义与简单实现

队列的定义与简单实现和栈相反，队列是一种先进先出（FIFO）的线性表，队列仅在线性表的两端进行操作： 1.队头(Front)：取出数据元素的一端； 2.队尾

布满荆棘的人生/ 2022年05月31日 06:56/ 0 赞/ 149 阅读

相关 JavaScript自定义事件

标题JavaScript自定义事件最近遇到一个基于jQuery项目,项目中的功能节点页面都是通过iframe实现,但是各个iframe之间有时需要相互通信,互相相应一些

男娘i/ 2022年04月02日 04:14/ 0 赞/ 281 阅读

相关 JavaScript自定义事件

标题JavaScript自定义事件最近遇到一个基于jQuery项目,项目中的功能节点页面都是通过iframe实现,但是各个iframe之间有时需要相互通信,互相相应一些

太过爱你忘了你带给我的痛/ 2022年03月30日 14:22/ 0 赞/ 279 阅读