zoukankan      html  css  js  c++  java
  • 201603102057_《Javascript之观察者模式(模块间通讯)》

    <!-- Html代码-->
    <button type="button" id="count"> 点我</button>
    <div id="show"></div>
    /***********************
    *    Javascript代码    *
    ***********************/
    
    window.onload = function(){
    
    //将"发布者"与"订阅者"联系起来的"中介者"
    var Event = (function() {
    
    var clientList = [],
    listen,
    trigger,
    remove;
    
    listen = function(key, fn) {
    if (!clientList[key]) {
    clientList[key] = [];
    }
    clientList[key].push(fn);
    };
    
    trigger = function() {
    var key = Array.prototype.shift.call(arguments),
    fns = clientList[key];
    if (!fns || fns.length === 0) {
    
    return falsse;
    }
    
    for (var i = 0, fn; fn = fns[i++];) {
    fn.apply(this, arguments);
    }
    };
    
    remove = function(key, fn) {
    var fns = clientList[key];
    if (!fns) {
    return false;
    }
    
    if (!fn) {
    
    fns && (fns.length = 0);
    
    }else{
    
    for (var l = fns.length - 1; l >= 0; l--) {
    var _fn = fns[l];
    
    if (_fn === fn) {
    fns.splice(l, 1);
    }
    }
    }
    };
    
    return {
    listen: listen,
    trigger: trigger,
    remove: remove
    }
    
    })();
    
    
    var MOUDLE_A = (function(){
    var count = 0;
    var oBtn = document.getElementById('count');
    oBtn.onclick = function(){
    Event.trigger('add',count++);
    };
    })();
    
    var MOUDLE_B = (function(){
    var oDiv = document.getElementById('show');
    Event.listen('add', function(count){
    oDiv.innerHTML = count;
    });
    })();
    
    };
  • 相关阅读:
    单词接龙
    洛谷 P1015 回文数
    洛谷 P1012 拼数
    codevs 2780 ZZWYYQWZHZ
    专项练习之字符串
    模拟题1
    专项训练之线段树
    复习题之求后序遍历
    复习题之二叉树的遍历
    Hdu 3037 Saving Beans(Lucus定理+乘法逆元)
  • 原文地址:https://www.cnblogs.com/beesky520/p/5263458.html
Copyright © 2011-2022 走看看