观察者模式实现

不念不忘少年蓝@ 2021-09-02 04:13 491阅读 0赞

// 升级观察者
        var Observer = (function() {
            // 定义真正的观察者
            var ob = {
    
            }
    
            // 定义接口
            return {
                on: function(type, fn) {
                    /*
                     * on方法用于向观察者对象中添加事件
                     * @type 要添加的事件名称
                     * @fn 要添加的事件函数
                     **/
                    // 判断当前事件属性是否存在，直接push即可
                    if (ob[type]) {
                        ob[type].push(fn);
                    } else {
                        ob[type] = [fn];
                        // ob.type = [f]
                    }
                },
                /**
                 * trigger方法用于触发观察者对象中的事件
                 * @type 要触发的事件名称
                 **/
                // trigger用于触发观察者对象中的事件
                trigger: function(type, val) {
                    for (var i = 0; i < ob[type].length; i++) {
                        ob[type][i](val);
                    }
                },
    	        // off方法用于移除某个事件
    		off: function(type, fn) {
    			// 判断是要删除一组还是要删除某一个事件函数
    			if (fn) {
    				// 说明是要删除某个函数
    				for (var i = 0; i < ob[type].length; i++) {
    					if (ob[type][i] == fn) {
    						ob[type].splice(i, 1);
    					}
    				}
    			} else if (type) {
    				ob[type] = [];
    			} else {
    				// 情况观察者对象中的所有数据
    				ob = {};
    			}
    		},
    		// once方法 通过该方法只能触发一次事件
    		once: function(type, fn) {
    			// 定义的新的函数
    			function aaa() {
    				// 执行fn
    				fn();
    				// 执行完之后移除该函数
    				Observer.off(type, aaa);
    			}
    			Observer.on(type, aaa);
    		}
                check: function() {
                    console.log(ob);
                }，
    
            }
        })()