zoukankan      html  css  js  c++  java
  • js实现事件模型bind与trigger

    function Emitter() {
        this._listener = [];//_listener[自定义的事件名] = [所用执行的匿名函数1, 所用执行的匿名函数2]
    }
    
    //注册事件
    Emitter.prototype.bind = function(eventName, callback) {
        var listener = this._listener[eventName] || [];//this._listener[eventName]没有值则将listener定义为[](数组)。
        listener.push(callback);
        this._listener[eventName] = listener;
    }
    
     //触发事件
    Emitter.prototype.trigger = function(eventName) {
        var args = Array.prototype.slice.apply(arguments).slice(1);//atgs为获得除了eventName后面的参数(注册事件的参数)
        var listener = this._listener[eventName];
    
        if(!Array.isArray(listener)) return;//自定义事件名不存在
        listener.forEach(function(callback) {
            try {
                callback.apply(this, args);
            }catch(e) {
                console.error(e);
            }
        })
    }
    //实例
    var emitter = new Emitter();
        emitter.bind("myevent", function(arg1, arg2) {
            console.log(arg1, arg2);
        });
    
        emitter.bind("myevent", function(arg1, arg2) {
            console.log(arg2, arg1);
        });
    
        emitter.trigger('myevent', "a", "b");
    

      实现链式调用的例子,原理与事件模型相同

    function LazyMan(name) {
                return new _LazyMan(name);
            }
            function _LazyMan(name) {
                console.log("Hi This is " + name)
                this.task = [];
                var _this = this;
                var namer = (function(name) {
                    return function() {
                        console.log(name);
                        _this.next();
                    }
                })(name)
                this.task.push(namer);
                setTimeout(function() {
                    _this.next();
                }, 0);
                return this;
            }
            _LazyMan.prototype.next = function() {
                var fn = this.task.shift();
                fn&&fn();
            }
            _LazyMan.prototype.eat = function(val) {
                var _this = this;
                var eat = (function(val) {
                    return function() {
                        console.log("eat" + val);
                        _this.next();
                    }
                })(val);
                this.task.push(eat);
                return this;
            }
            _LazyMan.prototype.sleep = function(time) {
                var _this = this;
    
                var timer = (function(time) {
                    return function() {
                        setTimeout(function() {
                            console.log("wait");  
                            console.log("time=" + time);
                            _this.next();
                        }, time*1000);
                    }
                    
                })(time);
                this.task.push(timer);
                return this;
            }
        
        //LazyMan("Hank").eat("dinner").eat("supper");
        LazyMan("Hank").sleep(3).eat("dinner");

      

  • 相关阅读:
    寒假作业4
    UVA5870 乱搞 Smooth Visualization
    UVA5874 Social Holidaying 二分匹配
    UVA5876 Writings on the Wall 扩展KMP
    hdu1231 最大连续子序列
    hdu3535 混合背包
    hdu3613 扩展KMP
    hdu4333 扩展KMP
    扩展KMP
    hdu4287 字典树
  • 原文地址:https://www.cnblogs.com/pcd12321/p/5223347.html
Copyright © 2011-2022 走看看