The mediator mode of reading notes in JavaScript design patterns and development practices

1. Broker Mode

The role of the mediator pattern is to remove the tight coupling between objects and objects, and when an intermediary is added, all related objects communicate through intermediaries and no longer refer to each other

1.1 Example of the mediator pattern

Take the Bubble Hall game as an example, first define a player constructor, which has three prototype methods

Player.prototype.win,player.prototype.lose,player.prototype.die

When there are only two players, a player dies when the game is over and notifies his opponent to win

 function   Player (name) { this . Name=name;  null  ;}    Player.prototype.win  =function   () { Console.log ( this . name+ ' won '  =function   () { Console.log ( this . name+ ' lose '  =function   () { Console.log ( this . name+ ' die ' );  

Next create two players

var player1=new player (' Player 1 '); var player2=new player (' Player 2 '); // set enemy player1.enemy=player2;player2.enemy=player1; // when player 1 dies, call his own die method to complete a game player1.die ();

When players increase, each player has his or her teammates and several enemies.

Define an array players save all players, create players, loop players to set enemies and teammates for each player

var players=[];

Rewrite the constructor player so that each player object adds some attributes, namely the list of teammates, the list of enemies, the current status of the player, the name of the character, and the color of the player's team.

function Player (name,teamcolor) {    this. partners=[];      this. enemies=[];     this. state= ' Live ';     this. name=name;     this. teamcolor=Teamcolor;}

After victories and defeats, the results are prompted for each player

player.prototype.win=function() {    console.log (' winner: ' +this. name);}; Player.prototype.lose=function() {    console.log (' loser: ' +this. name);};

When the player dies, it needs to traverse the condition of the other teammates, if all the teammates die, the game fails, and the enemy all the players win

Player.prototype.die=function(){    varAll_dead=true;  This. state= ' dead ';  for(varI=0,partner;partner= This. partners[i++];){        if(Partner.state!= ' dead ') {All_dead=false;  Break; }    }    if(All_dead = = =true){         This. Lose ();  for(varI=0,partner;partner= This. partners[i++];) {partner.lose (); }         for(vari=0,enemy;enemy= This. enemies[i++];) {enemy.win (); }    }};

Finally define a factory to create the player

varplayerfactory=function(name,teamcolor) {varNewplayer=NewPlayer (Name,teamcolor);//Create a new player     for(vari=0,player;player=players[i++];) {//notify all players, new players join        if(Player.teamcolor = = = Newplayer.teamcolor) {//teammates joinPlayer.partners.push (Newplayer);        NewPlayer.partners.push (player); }Else{Player.enemies.push (newplayer);        NewPlayer.enemies.push (player);    }} players.push (Newplayer); returnNewplayer;};

Use this code to create 8 players, two teams of red and blue

var player1=playerfactory (' P1 ', ' Red '); var player2=playerfactory (' P2 ', ' Red '); var player3=playerfactory (' P3 ', ' red '); var player4=playerfactory (' P4 ', ' Red '); var player5=playerfactory (' P5 ', ' Blue '); var player6=playerfactory (' P6 ', ' Blue '); var player7=playerfactory (' P7 ', ' Blue '); var player8=playerfactory (' P8 ', ' Blue ');

Let the red team all die.

Player1.die ();p Layer2.die ();p Layer3.die ();p Layer4.die ();

Now the blu player wins.

1.2 Using the intermediary mode to transform the example above

In the example above, each player and other players are tightly coupled, Partners,enemies holds references to other player objects. When the object state changes, such as death, the traversal notification must be displayed to other players

The first is still the prototype method for defining the player constructor and the player object

function Player (name,teamcolor) {    this. name=name;      this. teamcolor=teamcolor;     this. state= state;}; Player.prototype.win=function() {    Console.log (this. name+ ' won') ;}; Player.prototype.lose=function() {    Console.log (this. name+ ' lost ') );};

//when the player diesPlayer.prototype.die=function(){     This. state= ' dead '; Playerdirector.receivemessage (' Playerdead ', This);};//Remove PlayerPlayer.prototype.remove=function() {Playerdirector.receivemessage (' Removeplayer ', This);};//Players Change Teamplayer.prototype.changeteam=function(color) {Playerdirector.receivemessage (' Changeteam ', This, color);};

Overwrite the factory function that created the player object

var playerfactory=function(name,teamcolor) {    var newplayer=New Player (name,teamcolor);    Playerdirector.receivemessage (' Addplayer ', newplayer);     return Newplayer;};

Playerdirector open an externally exposed interface ReceiveMessage, responsible for receiving messages sent by the player object,
When the player object is sent, it always sends its this as a parameter to Playdirector so that Playerdirector can identify which player object the message is from

varPlayerdirector= (function(){    varplayers={},//Save All Playersoperations={};//actions that a mediator can perform        //Add a playerOperations.addplayer=function(player) {varTeamcolor=Player.teamcolor//If the player has not yet set up a team, a new teamplayers[teamcolor]=players[teamcolor]| |[]; Players[teamcolor].push (player);//add players into the team    }; //Removing a playerOperations.removeplayer=function(player) {varTeamcolor=Player.teamcolor, Teamplayers=players[teamcolor]| | [];//all members of the team         for(vari=teamplayers.length-1;i>=0;i--){            if(teamplayers[i]===player{Teamplayers.splice (i,1);        }        }    }; //Players Change Teamoperations.changeteam=function(Player,newteamcolor) {operations.removeplayer (player); Player.teamcolor=Newteamcolor;    Operations.addplayer (player); }        //player DeathOperations.playerdead=function(player) {varTeamcolor=Player.teamcolor, Teamplayers=Players[teamcolor]; varAll_dead=true;  for(vari=0,player;player=teamplayers[i++];){            if(Player.state!= ' dead ') {All_dead=false;  Break; }        }        //If all died        if(all_dead===true){             for(vari=0,player;player=teamplayers[i++];) {player.lose (); }                         for(varColorinchplayers) {                if(Color!==Teamcolor) {                    varTeamplayers=players[color];//rival players                     for(vari=0,player;player=teamplayers[i++];) {player.win (); }                                    }            }        }    }        varReceivemessage=function(){        varMessage=Array.prototype.shift.call (arguments); Operations[message].apply ( This, arguments);        }; return{Receivemessage:receivemessage}}) ();

Now, in addition to the mediator itself, no player knows the existence of other players, the coupling between players and players has been lifted

A player does not need to notify other buyers of any action, only need to send a message to the intermediary

After the broker has finished processing the message, feed the results back to other players

The mediator mode of reading notes in JavaScript design patterns and development practices