zoukankan      html  css  js  c++  java
  • 实现一个EventEmitter类,这个类包含以下方法: on/ once/fire/off

    实现一个EventEmitter类,这个类包含以下方法: on(监听事件,该事件可以被触发多次)- once(也是监听事件,但只能被触发一次)- fire(触发指定的事件)- off(移除指定事件的某个回调方法或者所有回调方法)
    function EventEmitter() {
        this.handlers = {}
    }
    //监听事件,该事件可以被触发多次
    EventEmitter.prototype.on = function (eventName, handle) {
        if (!this.handlers.hasOwnProperty(eventName)) {
            this.handlers[eventName] = []
        }
        this.handlers[eventName].push(handle)
    }
    //也是监听事件,但只能被触发一次
    EventEmitter.prototype.once = function (eventName, handle) {
        
    }
    //触发指定的事件
    EventEmitter.prototype.fire = function (eventName, ...params) {
        if (!this.handlers.hasOwnProperty(eventName)) return
        //事件队列依次执行
        this.handlers[eventName].map(handle => {
            handle(...params)
        })
    }
    //移除指定事件的某个回调方法或者所有回调方法
    EventEmitter.prototype.off = function (eventName, handle) {
        if (!this.handlers.hasOwnProperty(eventName)) return
        //获取下标,并删除
        let index = this.handlers[eventName].indexOf(handle)
        this.handlers[eventName].splice(index, 1)
    }
    
    const emitter = new EventEmitter();
    emitter.on('drink', (person) => {
    console.log(person + '喝水')
    })
    emitter.on('eat', (person) => {
    console.log(person + '吃东西')
    })
    // event.once('buy', (person) => {
    // console.log(person + '买东西')
    // })
    emitter.fire('drink', '我') // 我喝水
    emitter.fire('drink', '我') // 我喝水
    emitter.fire('eat', '其它人') // 其它人吃东西
    emitter.fire('eat', '其它人') // 其它人吃东西
    emitter.fire('buy', '其它人') //其它人买东西
    emitter.fire('buy', '其它人') //这里不会再次触发buy事件,因为once只能触发一次
    emitter.off('eat') //移除eat事件
    emitter.fire('eat', '其它人') //这里不会触发eat事件,因为已经移除了
    

      

  • 相关阅读:
    Nginx配置文件nginx.conf详解
    Nginx的内部(进程)模型
    Nginx特点
    Nginx的事件处理机制
    8 个实用的 Bootstrap 3 案例教程
    超高速前端开发工具——Emmet
    3ds MaxVRay全套家装效果图制作典型实例第2版
    Word Excel PPT 2016完全自学教程
    Unity 5.X 3D游戏开发技术详解与典型案例
    C#从入门到精通(第2版)
  • 原文地址:https://www.cnblogs.com/yz-blog/p/11312596.html
Copyright © 2011-2022 走看看