zoukankan      html  css  js  c++  java
  • node中的事件 events模块

    events模块导入需要做三步:
    //核心模块是一个构造函数
    const EventEmitter = require("events");
    //继承
    class MyEventEmitter extends EventEmitter{};
    //实例化
    const myEventEmitter = new MyEventEmitter();
    //便于使用构造函数的prototype的原型方法。

    方法:


    on() : 绑定事件(on事件可以绑定多个函数)

    参数1:事件名称
    参数2:执行的函数

    emit() : 触发事件
    参数1:事件名称
    参数2:需要传递的参数

    once() : 只绑定一次事件
    参数1:事件名称
    参数2:执行的函数

    removeListener() : 移除指定事件
    参数1:事件名称
    参数2:需要移除的函数
    removeAllListeners() : 移除所有事件
    参数1:事件名称

    prependListener() : 将事件放在队列的最前面
    参数1:事件名称
    参数2:执行的函数

    function fn(val){
    console.log("1",val);
    }
    function fn1(val){
    console.log("2",val);
    }
    function fn2(val){
    console.log("3",val);
    }
    myEventEmitter.on("handle",fn);//handle自己创造的事件名称
    myEventEmitter.on("handle",fn1);
    myEventEmitter.prependListener("handle",fn2);
    3,哈哈哈
    1,哈哈哈
    2,哈哈哈
    3,哈哈哈
    1,哈哈哈
    2,哈哈哈
    // myEventEmitter.once("handle",fn);
    // myEventEmitter.once("handle",fn1);
    // myEventEmitter.once("handle",fn2);
    1,哈哈哈
    2,哈哈哈
    3,哈哈哈
    //myEventEmitter.removeListener("handle",fn2)
    1,哈哈哈
    2,哈哈哈
    //myEventEmitter.removeAllListeners("handle");
    空。

    myEventEmitter.emit("handle","哈哈哈")
    myEventEmitter.emit("handle","哈哈哈")

    off 如果有第二个参数则解绑第二个参数 如果没有则解绑全部
    封装on,emit,off
    原理:
    事件绑定一个事件名称对应多个事件函数 应此它们的关系是一对多的关系 数据类型采用对象的形式
    key:val 因为函数有多个 所以val选用数组
    事件仓库
    eventList = {
    key:val,
    key:val
    }

    绑定事件
    on(eventName,cb){}
    逻辑:
    第一步判断当前事件是否存在 如果不存在 初始化一下 key:[] 然后在将cb push到数据中去即可

    触发事件
    emit(eventName,params){}
    逻辑:
    第一步判断事件名称是否存在 如果存在 遍历数组中的所以函数调用即可 如果params存在 将params传递函数中

    解绑事件
    off(eventName,cb){}
    逻辑:
    第一步判断事件名称是否存在 如果存在 再次判断第二个参数是否存在 如果存在将这个cb从当前数组中移除
    如果第二个参数不存在 清空数据
    let eventList = {};
    //绑定事件
    const $on=(eventName,cb)=>{
    if(!eventList[eventName]){
    eventList[eventName] = [];
    }
    eventList[eventName].push(cb)
    }
    //触发事件
    const $emit = (eventName,params)=>{
    if(eventList[eventName]){
    let arr = eventList[eventName];
    arr.map((cb)=>{
    cb(params)
    })
    }
    }
    //解绑事件
    const $off = (eventName,cb)=>{
    if(eventList[eventName]){
    if(cb){
    let index = eventList[eventName].indexOf(cb);
    eventList[eventName].splice(index,1);
    }else{
    eventList[eventName].length = 0;
    }
    }
    }

  • 相关阅读:
    Linux-C基础知识学习:C语言作业-输入三角形底和高,输出三角形面积
    Linux-C基础知识学习:C语言作业-从键盘输入一个三位数,以逆序输出。例如输入456,输出654
    Linux基础知识学习:Linux下修改文件名或修改文件夹名称(有待解决问题)
    Linux基础知识学习:linux用命令重启
    Linux基础知识学习:linux用命令重启
    Linux基础知识学习:Linux中修改环境变量及使环境变量生效的方法
    Linux基础知识学习:Linux中修改环境变量及使环境变量生效的方法
    Linux基础知识学习:安装JDK出现 cannot execute binary file
    Linux基础知识学习:安装JDK(tar.gz)
    Linux基础知识学习:查看所使用的Linux系统是32位还是64 位的方法
  • 原文地址:https://www.cnblogs.com/newskill/p/10301783.html
Copyright © 2011-2022 走看看