js观察者模式

观察者模式又叫发布订阅模式

（Publish/Subscribe），它定义了一种一对多的关系，让多个观察者对象同时监听某一个主题对象，这个主题对象的状态发生变化时就会通知所有的观察者对象，使得它们能够自动更新自己。

使用观察者模式的好处：

1、支持简单的广播通信，自动通知所有已经订阅过的对象。
2、页面载入后目标对象很容易与观察者存在一种动态关联，增加了灵活性。
3、目标对象与观察者之间的抽象耦合关系能够单独扩展以及重用。

思路:
1、发布者对象需要一个数组类型的属性，以存储所有的订阅者。
2、订阅（即注册）行为就是将新的订阅者加入到这个数组中去，
3、则注销即是从这个数组中删除某个订阅者。
4、发布消息，就是循环遍历订阅者列表并通知他们。

先定义一个event对象，其内部包含了3个方法：订阅、发布、删除。

 var event = {
 //设置3个变量；
           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 false; 
                }
                for(var i=0,fn; fn=fns[i++]){//遍历缓存队列，发送消息；
                     fn.apply(this, arguments);
                }
           };



           remove = function(key,fn){ //删除订阅
                   var fns = clientList[key];
                   if(!fns){ //如果key对应的消息没有被人订阅，则直接返回
                        return false;
                   }
                   if(!fn){ //如果没有传入具体的回调函数，表示需要取消key对应消息的所有订阅
                       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
            };
     };



     Event.listen('squareMeter150',function(price){ // 李四订阅消息
              console.log('价格=' + price);
     });



      Event.trigger('squareMeter150',2000000); // 输出 2000000