简单剖析Node中的事件监听机制(一)

使用js的class类简单的实现一个事件监听机制,不同于浏览器中的时间绑定与监听,类似于node中的时间监听,并且会在接下来的文章中去根据自己的理解去写一下Event模块中的原理。

Node.js使用了一个事件驱动、非阻塞式I/O的模型,使其轻量又高效。并且Node中的大量模块都使用了Event机制,因此可以说是整个Node中最重要的模块之一。

实例:

    let event = new eventEmitter();
    event.on('someType',function(){

    });
    event.emit('someType');

依据上述例子,手动触发一个类型的事件,调用监听的回调函数,可以先来实现一个最为简单的小例子,例如下放代码:

class eventEmitter {
    constructor() {
        this.callEvent = '';
    }
    on(eventType, callback) {
        this.callEvent = callback;
    };
    emit(eventType) {
        this.callEvent();
    };
}
let event = new eventEmitter();
event.on('click', function () {
    console.log('click')
});
event.emit('click');

上述实现的代码,能够简单的实现,当我们执行emit()方法时,去执行原本on()中传入的回调函数。
我们知道node中的Event模块是一个简单的事件监听模式的实现。Event模块中只提供了一个对象EventEmitter,EventEmitter的核心就是事件监听与事件触发的监听功能的封装。

EventEmitter可以让我们注册一个或者多个函数作为listeners,在特定的事件触发时被调用。我们去监听的函数就是listeners。当然,我们可以注册多个监听事件,所以需要一个map结构来存储监听事件和回调函数的对应关系。

在EventEmitter类中,已键值对的方式来存储事件名和对应的监听器。

首先根据上边的类来实现我们on事件,先来个events来作为存储的键值对,每次传入的值为事件类型和回调函数,代码简单如下:

    EventEmitter.prototype.on = function on(type,listener){
    return _on(this,type,listener);
};

function _on(target,type,listener){
    var m;
    var events;
    var existing;
    if(typeof listener !== 'function'){
        throw new Error("监听者必须是一个函数");
    }
    //获取到对象上的监听事件键值对
    events = target._events;
    if(!events){
        //如果没有键值对,则重新自定义
        events = target._events = {};
        target._eventsCount = 0;
    }else{
        //获取原来键值对中的listener事件
        existing = events[type];
    }

    if(!existing) {
        //如果原本的事件监听的键值对中没有该type的该监听事件
        //则在events中存放该type和该监听事件的键值对
        existing = events[type] = listener;
        //并且当前内存中存放的监听事件加1
        ++target._eventsCount;
    }

    return target;
}

现在on事件可以使用了,我们先不去思考最大监听数的限制还有键值对的初始化不正确等其他因素,这些可以放在之后进行优化,接下来简单的去实现EventEmitter中的emit事件

EventEmitter.prototype.emit = function emit(type){
    return _emit(this,type);
};

function _emit(target,type){
    var events,exiting,handler;
    if(!type){
        throw new Error('触发的事件不能为空');
    }
    //获取到对象上的监听事件键值对
    events = target._events;
    //根据type获取到监听事件
    handler = events[type];
    if(!handler){
        return false;
    }
    handler();
}

同样的emit事件的实现是简单的从键值对中根据type获取到监听事件去执行。这里还没有考虑传入多个参数的情况。

根据上边的简单实现,我们可以来进行下尝试,比之前的版本相比,我们可以监听多个事件,去触发多个回调函数了。

event.on('click', function () {
    console.log('click')
});

event.on('click1',function (){
    console.log('click11');
});

event.emit('click');
//输出click

event.emit('click1');
//输出click11

console.log(event._events);
//输入{click: [Function],click1:[Function]}

这里简单的实现了多个事件注册,多个事件触发的EventEmitter,接下来会继续进行设置监听个数、以及触发时传入多个参数的剖析。

参考:[https://github.com/nodejs/node/blob/v6.0.0/lib/events.js]

原文地址:https://www.cnblogs.com/blackgan/p/9005090.html

时间: 2024-08-02 06:51:38

简单剖析Node中的事件监听机制(一)的相关文章

Java中的事件监听机制

鼠标事件监听机制的三个方面: 1.事件源对象: 事件源对象就是能够产生动作的对象.在Java语言中所有的容器组件和元素组件都是事件监听中的事件源对象.Java中根据事件的动作来区分不同的事件源对象,动作发生在哪个组件上,那么该组件就是事件源对象 2.事件监听方法: addMouseListener(MouseListener ml) ;该方法主要用来捕获鼠标的释放,按下,点击,进入和离开的动作:捕获到相应的动作后,交由事件处理类(实现MouseListener接口)进行处理. addAction

Java 中的事件监听机制

看项目代码时遇到了好多事件监听机制相关的代码.现学习一下: java事件机制包含三个部分:事件.事件监听器.事件源. 1.事件:继承自java.util.EventObject类,开发人员自己定义. package com.shuyan.javatest.EventTest; import java.util.EventObject; public class DnsEvent extends EventObject { private String userData; private long

vue中的事件监听机制

事件监听 基础用法 监听dom事件使用v-on指令: v-on:事件类型="一个函数" .这个事件类型可以自定义. v-on 指令绑定事件后,就会监听相应的事件,并在触发时运行一些 JavaScript 代码. <div id="box1"> <button v-on:click="counter += 1">点我</button> <p>已点击 {{ counter }} 次</p>

观察者模式与事件监听机制

一.观察者模式 1.1 概述 有时被称作发布/订阅模式,观察者模式定义了一种一对多的依赖关系,让多个观察者对象同时监听某一个主题对象.这个主题对象在状态发生变化时,会通知所有观察者对象,使它们能够自动更新自己.它类似B/S架构模式,构建一个服务端,多个客户端显示.其实这个主题对象就像是一个信息源,当信息源的状态发送变化时,它会通知所有订阅者,使它们进行相应的处理.在百度百科中的例子是,用户界面可以作为一个观察者,业务数据是被观察者,用户界面观察业务数据的变化,发现数据变化后,就显示在界面上. 1

.NET事件监听机制的局限与扩展

.NET中把“事件”看作一个基本的编程概念,并提供了非常优美的语法支持,对比如下C#和Java代码可以看出两种语言设计思想之间的差异. // C#someButton.Click += OnSomeButtonClick; // JavasomeButton.addActionListener( new ActionListener(){ public void actionPerformed(){ ... } }); 在我们的软件中就大量使用事件来对监听者与发布者解耦,但也遇到了一些局限,在这

JAVA 图形开发之计算器设计(事件监听机制)

/*文章中用到的代码只是一部分,需要源码的可通过邮箱联系我 [email protected]*/ 前段时间刚帮同学用MFC写了个计算器,现在学到JAVA的图形开发,就试着水了一个计算器出来.(可以说是一个水的不能再水的计算器了,感觉MFC真好用) 既然是设计计算器,首先肯定是要做一个计算器界面出来了,但面对JAVA容器的两种布局,想把按钮放整齐真的是一件比较难的事,我就直接用了坐标法贴图(上篇博客中有介绍).这是我设计的界面 界面设计完了,下面就要开始实现按按钮输入数据.这时就需要使用事件监听

4.JAVA之GUI编程事件监听机制

事件监听机制的特点: 1.事件源 2.事件 3.监听器 4.事件处理 事件源:就是awt包或者swing包中的那些图形用户界面组件.(如:按钮) 事件:每一个事件源都有自己特点有的对应事件和共性事件.(如:鼠标单击事件) 监听器:将可以触发某一事件的动作(不止一个动作)都已经封装到了监听器中. 以上三者,在java中都已经定义好了,直接获取其对象来用就可以了. 我们要做的事情是,就是对产生的动作进行处理. 图解事件监听机制: 4.JAVA之GUI编程事件监听机制,布布扣,bubuko.com

关于事件监听机制的总结(Listener和Adapter)

记得以前看过事件监听机制背后也是有一种设计模式的.(设计模式的名字记不清了,只记得背后实现的数据结构是数组.) 附上事件监听机制的分析图: 一个事件源可以承载多个事件(只要这个事件源支持这个事件就可以,男人就不支持生孩子的事件)  事件和监听器有对应关系的. 下面用awt中的标准图形化界面分析: 接口WindowListener 中有一个实现类WindowAdapter类.适配器类. EventListener.java 下面是所有超级接口EventListener.java的源代码   其实就

Spring架构揭秘-事件监听机制

一.事件监听机制概述 二.事件监听机制结构 三.Spring监听机制架构 Spring的Application拥有发布事件并且注册事件监听器的能力,拥有一套完整的事件发布和监听机制.在Java中,通过java.util. EventObject来描述事件,通过java.util. EventListener来描述事件监听器,在众多的框架和组件中,建立一套事件机制通常是基于这两个接口来进行扩展. 在一个事件体系中,有以下几个重要的概念. 1.事件源:事件对象的产生者,任何一个EventObject