javascript mediator pattern

定義javascript

定義一個對象,它封裝一組相互做用的對象。中介者促使對象之間保持通信可是又鬆耦合,你能夠很獨立的改變他們的相互做用。java

提要函數

中介者提供一個權威中心,用來控制一組對象之間的相互做用。這種模式在這種情境下是很是有用的:在一個複雜的環境裏的每個對象都很但願清楚其餘對象的任何狀態變化。this

中介者模式在開發複雜的表單中很是有用。舉一個列子,在一個頁面上,你但願預約一個航班;一個簡單的中介者規則就是:你必須輸入一個有效的出發時間,一個有效的返回時間,返回時間必須晚於出發時間,一個有效的起飛機場,一個有效的降落機場,一個有效的旅行者證件號碼,只要這些知足以後,搜索或者提交按鈕才能被激活變爲可用。prototype

另外一箇中介者的例子就是飛機場協調起飛和降落的調度中心。對象

圖標說明blog

Diagram JavaScript Mediator Design Pattern

一個聊天室的例子接口

  • 中介者 -- 在下面的示例代碼中:Chartroom
    •   定義參與對象之間通信接口
    •   持有全部參與者的引用
    •   整個運做的管理調度中心
  • 參與者 -- 在下面的示例代碼中: Participants
    •   被中介者調度的對象
    •   每一個對象實例都持有中介者的引用

Javascript 示例代碼ip

在示例代碼中,有4個參與者經過註冊的方式被添加到了聊天室(中介者)的會話當中。參與者能夠給彼此發送消息,聊天室接手控制着相互之間的路由。
這個例子是很簡單的,可是能夠繼續添加複雜的規則,好比垃圾信息過濾,用來避免參與者接收到垃圾信息。ci

log 方法是一個助手程序,幫助收集和展現結果。

var Participant = function(name){
  this.name = name;
  this.chartroom = null;  
}

Participant.prototype = {
  send: function(message, to){
    //發送方法通常用來向中介者發送消息,告訴中介者我哪些狀態發生了變化,讓中介者來決定作些什麼
    this.chartroom.send(message, this, to);
  },
  receive: function(message, from){
    //接受方法通常用來收到中介者的消息以後,作些什麼
    //下面就是讓log把信息收集起來
    log.add(from.name + ' to ' + this.name + ': ' + message);
  }
}

var Chartroom = function(){
//這裏定義了一箇中介者Chartroom

  var participants = {}; //用來收集持有參與者的一個變量容器
  return { //返回對外暴露的接口
    register: function(participant){
      participants[participant.name] = participant;
      participant.chartroom = this; //把本身這個中介者的引用傳給參與者,讓參與者持有中介者的引用,讓參與者本身知道他的leader是誰
    },
    send: function(message, from, to){
      if(to){
        to.receive(message, from);
      }else{
        for(var key in participants){
          if(participants[key] !== from){
            participants[key].receive(message, from);
          }
        }
      }
    }
  };
}

//爲何log首字母,是由於後面是一個當即執行的函數,執行完以後,log被賦值了一個對象,因此log是個對象,要小寫
var log = (function(){
  var log = ''; //至關於用於記錄log信息的數據文件
  return {
    add: function(msg){ log += msg + '\n';},
    show: function(){ alert(log); log = '';} //輸出log信息,同時清空log文件中的內容
  };
})();

function run() {
  var yoko = new Participant('Yoko');
  var john = new Participant('John');
  var paul = new Participant('Paul');
  var ringo = new Participant('Ringo');

  var chartroom = new Chartroom();

  chartroom.register(yoko);
  chartroom.register(john);
  chartroom.register(paul);
  chartroom.register(ringo);

  yoko.send('All you need is love.');
  yoko.send('I love you John.');
  john.send('Hey, no need to broadcast', yoko);
  paul.send('Ha, I heard that!');
  ringo.send('Poul, what do you think?', paul);

  log.show();
}

運行的結果:

  alert

 

參考引用:http://www.dofactory.com/javascript-mediator-pattern.aspx

相關文章
相關標籤/搜索