2018-01-15 js观察者模式设计

观察者模式

当一个对象的状态发生改变时，所有依赖于它的对象都会得到通知，也简称发布-订阅模式。类似微信订阅公众号，当它有新的文章发表后，就会推送给我们所有订阅的人

优点：
1.我们无需关注公众号是否有新的文章发布
2.我们和公众号没有强耦合在一起，公众号不关心谁订阅了它

自定义事件

现在我们想要实现这样的功能，定义一个事件，它有以下功能

• 监听事件（订阅公众号）
• 触发事件（公众号发布）
• 移除事件（取消关注公众号）

//代码如下
var Event = (function(){
  var list = {},//存储公众号
      on,
      emit,
      remove;
  //监听事件
  on = function(key,fn){
    if(!list[key]){
      list[key] = [];如果不存在key,创建
    }
    list[key].push(fn);//将回调函数存储到对应的key
  };
  //触发事件
  emit = function(){
    var key = Array.prototype.shift.call(arguments);//获取key值
    var msg = list[key];
    if(!msg || msg.length === 0){
      return false;//不存在对应的回调函数，返回false
    }
    for(var i = 0; i < msg.length; i++){
      msg[i].apply(this,arguments);//循环执行回调函数
    }
  }；
  //移除事件
  remove = function(key,fn){
    var msg = list[key];
    if(!msg){
      return false;//如果不存在事件 返回false
    }
    if(!fn){
     delete list[key];//没有指定的回调函数，则删除key 可以理解公众号下架了
    }else{
      for(var i = 0; i < msg.length; i ++){
        if(msg[i] === fn){
          msg.splice(i, 1);//删除指定的回调函数
        }
      }
    }
  }；
  // 返回对象
  return {
    on:on,
    emit:emit,
    remove:remove
  }
})();

var fn = function(data){
  console.log(data+"推送消息来啦~~~")
}
Event.on('click'，fn);//订阅公众号
Event.emit('click',"2018.01.15")//发布公众号
Event.remove('click',fn);//取消关注公众号