zoukankan      html  css  js  c++  java
  • 观察者模式的记录

    常见的一种设计模式,我看了两个版本的设计模式,结合我自己的开发实践,觉得还是这种模式最为常用。

    应用场景:一个页面,根据功能分为 A B C三个模块。三个模块互相有通信和依赖的需求。比如,A中的动作可能会触发B区域的某个事件,B区域的某个事件需要依赖于

    A区域的某些接口。

    很多地方都会遇到这样的情形,比如微博的页面,比如一个购物车页面,以微博的首页为例,先看下首页原型图(自己画的 有点丑)

    类似于这样的一个页面 假如根据功能,我们将之分为A:发布框, B:微博展示区, C 微博总数区 三个Moudle。当发布了一条微博后,B区域需要插入一条微博,C区域需要总数值加1.基于这样的逻辑,我们可以 让B和C来监听A。只要A发布了微博,B就会执行addItem C就会执行addNum.

    这样的一个监听装置,其实也是比较简单的。

    var listener = {
                list : [], //用于保存B的addItem C的addNum等。
                publish : function(name,args){
                    if(!this.list[name]){
                        this.list[name] = [];
                    }
                    var list = this.list[name];
                    if(list.length > 0){
                        for(var i=0; i<list.lengt; i++){
                            list[i](args);
                        }
                    }
                },
                subscribe : function(name,callback){
                    if(!this.list[name]){
                        this.list[name] = [];
                    }
                    this.list[name].push(callback);
                    return len; //当前callback在list中的顺序,用于unsubscribe;
                },
                unsubscribe : function(name,n){
                    this.list[name].splice(n);
                }
                
            }

    具体的例子地址:http://jsbin.com/nonuj/6/edit

  • 相关阅读:
    通过接口实现适用于SqlServer和MySql的SqlHelper
    javascript面向对象(二)
    闭包
    javascript面向对象(一)
    引用类型——function
    引用类型——数组
    引用类型
    javascript变量的作用域
    正则表达式语法
    FCKeditor插件 中文解释
  • 原文地址:https://www.cnblogs.com/lxin/p/3652576.html
Copyright © 2011-2022 走看看