设计模式.md

js设计模式

观察者模式(发布订阅模式)

1. 创建观察者对象

1.1 观察者对象: 
    一个消息容器
    三个方法: 订阅消息方法,取消订阅方法,发送订阅消息方法
1.2 观察者对象雏形
// 将观察者放在闭包中,当页面加载就立即执行
var Observer = (function(){
    //防止消息队列暴露而被篡改 故将消息容器作为静态私有变量保存
    var _messages = {};
    return {
        //注册信息接口
        regist : function(){},
        //发布信息接口
        fire   : function(){},
        //移除信息接口
        remove : function(){}
    }
})() 
1.3  消息注册方法
      a. 作用: 将订阅者注册的消息推入到消息队列中
      b. 接收参数: 消息类型  相应处理动作

regist : function(type,fn){
     //如果此消息不存在 则应创建一个该消息类型
     if(typeof _messages[type] === 'undefined'){
         //将动作推入到该消息对应的动作执行队列中
         _messages[type] = [fn] ;
     }else{
         //如果此消息存在

         _messages[type].push(fn);
         //将动作方法推入该消息对应的动作执行序列中
     }

}
1.4  发布消息方法
       a. 功能: 当观察者发布一个消息时，将所有订阅者订阅的消息一次执行
       b. 接收参数: 消息类型  动作执行需要传递的参数

fire: function(type,args){
    //如果该消息没有被注册,则返回
    if(　!_messages[type]){
        return ;
    }else{
        //定义消息信息
        var events = {
            type : type,               //消息类型
            args : args || {}          //消息携带数据
        },
        i = 0,                         //消息动作循环变量
        len =  _messages[type.length]  //消息动作长度
        
        //遍历消息动作
        for(;i<len;i++){
            //一次执行注册的消息对应的动作序列
            _messages[type][i].call(this,events);
        }
    }
}
1.5   信息注销方法
        a. 功能 : 将订阅者注销的信息从消息队列中清除
        b. 接收参数 : 消息类型 执行某一动作

remove : function(type,fn){
     //如果消息动作队列存在
     if(_messages[type] instanceof Array){
         //从最后一个动作遍历
         var i = _messages[type].length - 1;
         for(;i>=0;i--){
            //如果存在该动作则在消息队列中移除相应动作
            _messages[type][i] === fn && _messages[type].splice(i,1);
         }
     }
}

代理模式

代理模式(Proxy):由于一个对象不能直接引用另一个对象,所以需要通过代理对象在这两个对象间起到中介作用
跨域:
1. 同一域名不同端口号  http://www.baodu.com:8001 与 http://www.baodu.com:8002
2. 同一域名不同协议    http://www.baodu.com      与 https://www.baodu.com
3. 域名与域名的IP      http://www.baodu.com      与 http://61.135.169.125
4. 主域与子域          http://www.baodu.com      与 http://b.a.com
5. 子域与子域          http://tieba.baodu.com    与 http://fanyi.baodu.com

单例模式

单例模式(Singleton):又被称为单体模式,是只允许实例化一次的对象类
单例模式常用来定义命名空间(namespace)  如: jQuery.animate()
通过单例模式来管理代码库的各个模块      如:   baidu.dom.addClass    //添加元素类
                                           baidu.dom.append      //插入元素
                                           baidu.event.stopPropagation //阻止冒泡
                                           baidu.event.preventDefault  //阻止默认行为
                                           baidu.string.encodeHTML     //将字符串进行HTML编码

参考 http://wiki.jikexueyuan.com/project/javascript-design-patterns/constructor-mode.html