Heim  >  Artikel  >  Web-Frontend  >  Ausführliche Erläuterung der Beispiele für JavaScript-Mediatormuster

Ausführliche Erläuterung der Beispiele für JavaScript-Mediatormuster

小云云
小云云Original
2018-02-05 09:40:451180Durchsuche

Dieser Artikel stellt hauptsächlich den Mediator-Modus des JavaScript-Entwurfsmusters vor. Er analysiert das Konzept, das Prinzip, die Vor- und Nachteile des Mediator-Modus im Detail und vermittelt Freunden, die ihn benötigen, relevante Verwendungsfähigkeiten Ich kann darauf verweisen. Ich hoffe, es kann allen helfen.

1. Definition

Das Vermittlermuster fasst die Art und Weise zusammen, wie eine Reihe von Objekten interagieren, sodass diese Objekte nicht offensichtlich miteinander interagieren müssen. Dadurch können sie lose gekoppelt werden. Wenn sich die Interaktion zwischen einigen Objekten ändert, hat dies keinen unmittelbaren Einfluss auf die Interaktion zwischen anderen Objekten. Stellen Sie sicher, dass diese Effekte unabhängig voneinander geändert werden können. Das Mediator-Muster wandelt Viele-zu-Viele-Interaktionen in Eins-zu-Viele-Interaktionen um. Das Vermittlermuster abstrahiert das Verhalten und die Zusammenarbeit von Objekten und behandelt das kleinräumige Verhalten von Objekten getrennt von den Interaktionen mit anderen Objekten.

2. Gründe für die Verwendung

Wenn es viele Wechselwirkungen zwischen Objekten gibt und das Verhalten jedes Objekts voneinander abhängt, um eine Änderung eines Objekts zu verhindern Wenn das Verhalten eines Objekts die gleichzeitige Änderung des Verhaltens vieler anderer Objekte beinhaltet, kann das Mediatormuster zur Lösung des Problems der engen Kopplung verwendet werden.

Dieses Muster dreht die Viele-zu-Viele-Beziehung zwischen Objekten um in eine Eins-zu-Viele-Beziehung umwandelt das System von einer Netzwerkstruktur zu einer Sternstruktur, die sich auf den Mediator konzentriert, wodurch die Komplexität des Systems verringert und die Skalierbarkeit verbessert wird Musterstrukturdiagramm:

Der Vermittlermodus umfasst die folgenden Rollen:

●Abstrakter Vermittler (Vermittler) Rolle: Definieren Kollegen Eine Schnittstelle von einem Objekt zu einem Mediatorobjekt, bei der die Hauptmethode eine (oder mehrere) Ereignismethoden ist. ●Rolle des Betonmediators (ConcreteMediator): Implementiert die vom abstrakten Mediator deklarierte Ereignismethode. Der spezifische Mediator kennt alle spezifischen Kollegenklassen und ist für die spezifische Koordinierung der Interaktion zwischen den einzelnen Kollegenobjekten verantwortlich.

●Abstrakte Kollegenklasse (Kollege) Rolle: Definiert die Schnittstelle vom Vermittler zum Kollegenobjekt. Kollegenobjekte kennen nur den Mediator und nicht die anderen kollegialen Objekte.

●ConcreteColleague-Rolle: Alle konkreten Kollegenklassen erben von der abstrakten Kollegenklasse. Um Ihr eigenes Geschäft umzusetzen, kommunizieren Sie mit dem Mediator, der es führt, wenn Sie mit anderen Kollegen kommunizieren müssen. Der Mediator ist für die Interaktion mit anderen Kollegen verantwortlich.


JS-Implementierungscode:

optisches CD-Laufwerk


CPU-Prozessor

function CDDriver( mediator ) {
  //持有一个调停者对象
  this.mediator = mediator;
  /**
   * 获取当前同事类对应的调停者对象
   */
  this.getMediator = function() {
    return mediator;
  }
 //光驱读取出来的数据
 this.data = "";
  /**
   * 获取光盘读取出来的数据
   */
  this.getData = function() {
    return this.data;
  }
  /**
   * 读取光盘
   */
  this.readCD = function(){
    //逗号前是视频显示的数据,逗号后是声音
    this.data = "西游记,老孙来也!";
    //通知主板,自己的状态发生了改变
    this.getMediator().changed(this);
  }
}


Grafikkarte

function CPU( mediator ) {
 //持有一个调停者对象
 this.mediator = mediator;
 /**
  * 获取当前同事类对应的调停者对象
  */
 this.getMediator = function() {
   return mediator;
 }
  //分解出来的视频数据
  this.videoData = "";
  //分解出来的声音数据
  this.soundData = "";
  /**
   * 获取分解出来的视频数据
   */
  this.getVideoData = function() {
    return this.videoData;
  }
  /**
   * 获取分解出来的声音数据
   */
  this.getSoundData = function() {
    return this.soundData;
  }
  /**
   * 处理数据,把数据分成音频和视频的数据
   */
  this.executeData = function(data){
    //把数据分解开,前面是视频数据,后面是音频数据
    var array = data.split(",");
    this.videoData = array[0];
    this.soundData = array[1];
    //通知主板,CPU完成工作
    this.getMediator().changed(this);
  }
}


Soundkarte

function VideoCard( mediator ) {
  //持有一个调停者对象
  this.mediator = mediator;
  /**
   * 获取当前同事类对应的调停者对象
   */
  this.getMediator = function() {
    return mediator;
  }
  /**
   * 显示视频数据
   */
  this.showData = function(data){
    console.log("正在播放的是:" + data);
  }
}


Spezifische Mediatorklasse

function SoundCard( mediator ){
  //持有一个调停者对象
  this.mediator = mediator;
  /**
   * 获取当前同事类对应的调停者对象
   */
  this.getMediator = function() {
    return mediator;
  }
  /**
   * 按照声频数据发出声音
   */
  this.soundData = function(data){
    console.log("输出音频:" + data);
  }
}


Kunde

function MainBoard() {
  //需要知道要交互的同事类——光驱类
  this.cdDriver = null;
  //需要知道要交互的同事类——CPU类
  this.cpu = null;
  //需要知道要交互的同事类——显卡类
  this.videoCard = null;
  //需要知道要交互的同事类——声卡类
  this.soundCard = null;
  this.setCdDriver = function(cdDriver) {
    this.cdDriver = cdDriver;
  }
  this.setCpu = function(cpu) {
    this.cpu = cpu;
  }
  this.setVideoCard = function(videoCard) {
    this.videoCard = videoCard;
  }
  this.setSoundCard = function(soundCard) {
    this.soundCard = soundCard;
  }
  this.changed = function(c) {
    if(c instanceof CDDriver){
      //表示光驱读取数据了
      this.opeCDDriverReadData(c);
    }else if(c instanceof CPU){
      this.opeCPU(c);
    }
  }
  /**
   * 处理光驱读取数据以后与其他对象的交互
   */
  this.opeCDDriverReadData = function(cd){
    //先获取光驱读取的数据
    var data = cd.getData();
    //把这些数据传递给CPU进行处理
    cpu.executeData(data);
  }
  /**
   * 处理CPU处理完数据后与其他对象的交互
   */
  this.opeCPU = function(cpu){
    //先获取CPU处理后的数据
    var videoData = cpu.getVideoData();
    var soundData = cpu.getSoundData();
    //把这些数据传递给显卡和声卡展示出来
    this.videoCard.showData(videoData);
    this.soundCard.soundData(soundData);
  }
}


Druckeffekt

//创建调停者——主板
var mediator = new MainBoard();
//创建同事类
var cd = new CDDriver(mediator);
var cpu = new CPU(mediator);
var vc = new VideoCard(mediator);
var sc = new SoundCard(mediator);
//让调停者知道所有同事
mediator.setCdDriver(cd);
mediator.setCpu(cpu);
mediator.setVideoCard(vc);
mediator.setSoundCard(sc);
//开始看电影,把光盘放入光驱,光驱开始读盘
 cd.readCD();

Vorteile des Mediatormusters

● Lose Kopplung: Das Mediatormuster kapselt die Interaktionen zwischen mehreren Kollegenobjekten in das Mediatorobjekt und macht so die Co -Worker-Objekte sind lose gekoppelt und grundsätzlich in der Lage, komplementäre Abhängigkeiten zu erreichen. Auf diese Weise können Kollegenobjekte unabhängig voneinander geändert und wiederverwendet werden, anstatt wie bisher „eine Stelle zu verschieben und den gesamten Körper zu beeinträchtigen“. ● Zentralisierte Steuerung der Interaktion: Die Interaktion mehrerer Kollegenobjekte ist zur zentralen Verwaltung im Mediatorobjekt gekapselt. Wenn sich diese interaktiven Verhaltensweisen ändern, müssen Sie natürlich nur das Mediatorobjekt ändern. Erweitern Sie dann das Mediatorobjekt, und jede Kollegenklasse muss nicht geändert werden.

● Aus Viele-zu-Viele wird Eins-zu-Viele: Wenn das Vermittlermuster nicht verwendet wird, ist die Beziehung zwischen Kollegenobjekten normalerweise eine Viele-zu-Viele-Beziehung und das Kollegenobjekt ändert sich normalerweise bidirektional, was das Verständnis und die Implementierung der Objektbeziehung erleichtert.



Nachteile des Mediator-Musters

Ein potenzieller Nachteil des Mediator-Musters ist die Überzentralisierung. Wenn die Interaktion zwischen Kollegenobjekten sehr groß und komplex ist und sich all diese Komplexitäten auf den Mediator konzentrieren, wird das Mediatorobjekt sehr komplex und schwierig zu verwalten und zu warten.

Verwandte Empfehlungen:

Detaillierte Erläuterung des Service-Locator-Musters, Beispiel eines PHP-Entwurfsmusters

Detaillierte Erläuterung des Delegationsmusters von PHP Entwurfsmuster

Detaillierte Erklärung des PHP-Entwurfsmuster-Builder-Musters

Node.js Entwurfsmuster verwendet Streams zur Codierung

PHP Design Patterns Simple Factory Pattern

Das obige ist der detaillierte Inhalt vonAusführliche Erläuterung der Beispiele für JavaScript-Mediatormuster. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn