《JavaScript设计模式与开发实践》读书笔记之中介者模式
1. 中介者模式
中介者模式的作用就是用来解除对象与对象之间的紧耦合关系,增加中介者后,所有相关对象都通过中介者来通信,而不再相互引用
1.1中介者模式的例子
以泡泡堂游戏为例,先定义一个玩家构造函数,它有三个原型方法
Player.prototype.win,Player.prototype.lose,Player.prototype.die
当只有两个玩家时,一个玩家死亡时游戏结束,同时通知他的对手胜利
function Player(name){
this.name=name;
this.enemy=null;
}
Player.prototype.win=function(){
console.log(this.name+'won');
};
Player.prototype.lose=function(){
console.log(this.name+'lose');
};
Player.prototype.die=function(){
console.log(this.name+'die');
};
接下来创建两个玩家
var player1=new Player('玩家1');
var player2=new Player('玩家2');
//设置敌人
player1.enemy=player2;
player2.enemy=player1;
//玩家1死亡时,调用自己的die方法完成一局游戏
player1.die();
当玩家增加时,每个玩家有了自己的队友和若干敌人
定义一个数组players保存所有的玩家,创建玩家之后,循环players来给每个玩家设置敌人和队友
var players=[];
再改写构造函数Player,使每个玩家对象都增加一些属性,分别是队友列表、敌人列表、玩家当前状态、角色名字以及玩家所在队伍的颜色
function Player(name,teamColor){
this.partners=[];
this.enemies=[];
this.state='live';
this.name=name;
this.teamColor=teamColor;
}
胜利和失败后,对每个玩家提示结果
Player.prototype.win=function(){
console.log('winner:'+this.name);
};
Player.prototype.lose=function(){
console.log('loser:'+this.name);
};
玩家死亡时,需要遍历其他队友的状况,如果队友全部死亡,这局游戏失败,同时敌人所有玩家胜利
Player.prototype.die=function(){
var all_dead=true;
this.state='dead';
for(var i=0,partner;partner=this.partners[i++];){
if(partner.state!='dead'){
all_dead=false;
break;
}
}
if(all_dead === true){
this.lose();
for(var i=0,partner;partner=this.partners[i++];){
partner.lose();
}
for(var i=0,enemy;enemy=this.enemies[i++];){
enemy.win();
}
}
};
最后定义一个工厂来创建玩家
var playerFactory=function(name,teamColor){
var newPlayer=new Player(name,teamColor);//创建新玩家
for(var i=0,player;player=players[i++];){//通知所有玩家,新玩家加入
if(player.teamColor === newPlayer.teamColor){//队友加入
player.partners.push(newPlayer);
newPlayer.partners.push(player);
}else{
player.enemies.push(newPlayer);
newPlayer.enemies.push(player);
}
}
players.push(newPlayer);
return newPlayer;
};
用这段代码来创建8个玩家,分属红蓝两队
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');
让红队全部死亡
player1.die();
player2.die();
player3.die();
player4.die();
此时蓝队玩家胜利
1.2 用中介者模式改造上述示例
上述示例中,每个玩家和其他玩家都是紧耦合在一起,partners,enemies保存着其他玩家对象的引用。当对象状态改变,如死亡时,必须显示遍历通知其他玩家
首先仍然是定义Player构造函数和player对象的原型方法
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');
};
//玩家死亡时
Player.prototype.die=function(){
this.state='dead';
playerDirector.ReceiveMessage('playerDead',this);
};
//移除玩家
Player.prototype.remove=function(){
playerDirector.ReceiveMessage('removePlayer',this);
};
//玩家换队
Player.prototype.changeTeam=function(color){
playerDirector.ReceiveMessage('changeTeam',this,color);
};
改写创建玩家对象的工厂函数
var playerFactory=function(name,teamColor){
var newPlayer=new Player(name,teamColor);
playerDirector.ReceiveMessage('addPlayer',newPlayer);
return newPlayer;
};
playerDirector开放一个对外暴露的接口ReceiveMessage,负责接收player对象发送的消息,
而player对象发送的时候,总是把自身this作为参数发送给playDirector,以便playerDirector识别消息来自于哪个玩家对象
var playerDirector=(function(){
var players={},//保存所有玩家
operations={};//中介者可以执行的操作
//新增一个玩家
operations.addPlayer=function(player){
var teamColor=player.teamColor
//如果该颜色的玩家还没有成立队伍,则新成立一个队伍
players[teamColor]=players[teamColor]||[];
players[teamColor].push(player);//添加玩家进队伍
};
//移除一个玩家
operations.removePlayer=function(player){
var teamColor=player.teamColor,
teamPlayers=players[teamColor]||[];//该队伍所有成员
for(var i=teamPlayers.length-1;i>=0;i--){
if(teamPlayers[i]===player{
teamPlayers.splice(i,1);
}
}
};
//玩家换队
operations.changeTeam=function(player,newTeamColor){
operations.removePlayer(player);
player.teamColor=newTeamColor;
operations.addPlayer(player);
}
//玩家死亡
operations.playerDead=function(player){
var teamColor=player.teamColor,
teamPlayers=players[teamColor];
var all_dead=true;
for(var i=0,player;player=teamPlayers[i++];){
if(player.state!='dead'){
all_dead=false;
break;
}
}
//如果全部死亡
if(all_dead===true){
for(var i=0,player;player=teamPlayers[i++];){
player.lose();
}
for(var color in players){
if(color !== teamColor){
var teamPlayers=players[color];//对手玩家
for(var i=0,player;player=teamPlayers[i++];){
player.win();
}
}
}
}
}
var ReceiveMessage=function(){
var message=Array.prototype.shift.call(arguments);
operations[message].apply(this,arguments);
};
return{
ReceiveMessage:ReceiveMessage
}
})();
现在除了中介者本身,没有一个玩家知道其他玩家的存在,玩家与玩家之间的耦合关系已经解除
某个玩家的任何操作不需要通知其他买家,只需要给中介者发送一个消息
中介者处理完消息之后,把处理结果反馈给其他玩家
《JavaScript设计模式与开发实践》读书笔记之中介者模式的更多相关文章
- JavaScript设计模式与开发实践——读书笔记1.高阶函数(上)
说来惭愧,4个多月未更新了.4月份以后就开始忙起来了,论文.毕设.毕业旅行等七七八八的事情占据了很多时间,毕业之后开始忙碌的工作,这期间一直想写博客,但是一直没能静下心写.这段时间在看<Java ...
- JavaScript设计模式与开发实践——读书笔记1.高阶函数(下)
上部分主要介绍高阶函数的常见形式,本部分将着重介绍高阶函数的高级应用. 1.currying currying指的是函数柯里化,又称部分求值.一个currying的函数会先接受一些参数,但不立即求值, ...
- Javascript设计模式与开发实践读书笔记(1-3章)
第一章 面向对象的Javascript 1.1 多态在面向对象设计中的应用 多态最根本好处在于,你不必询问对象“你是什么类型”而后根据得到的答案调用对象的某个行为--你只管调用行为就好,剩下的一切 ...
- javascript设计模式与开发实践阅读笔记(8)——观察者模式
发布-订阅模式,也叫观察者模式:定义对象间的一种一对多的依赖关系,当一个对象的状态发生改变时,所有依赖于它的对象都将得到通知. 在JavaScript开发中,我们一般用事件模型来替代传统的观察者模式. ...
- javascript设计模式与开发实践阅读笔记(7)——迭代器模式
迭代器模式:指提供一种方法顺序访问一个聚合对象中的各个元素,而又不需要暴露该对象的内部表示. 迭代器模式可以把迭代的过程从业务逻辑中分离出来,在使用迭代器模式之后,即使不关心对象的内部构造,也可以按顺 ...
- javascript设计模式与开发实践阅读笔记(6)——代理模式
代理模式:是为一个对象提供一个代用品或占位符,以便控制对它的访问. 代理模式的关键是,当客户不方便直接访问一个对象或者不满足需要的时候,提供一个替身对象来控制对这个对象的访问,客户实际上访问的是替身对 ...
- javascript设计模式与开发实践阅读笔记(4)——单例模式
定义 单例模式:保证一个类仅有一个实例,并提供一个访问它的全局访问点. 具体来说,就是保证有些对象有且只有一个,比如线程池.全局缓存.浏览器中的window 对象等.在js中单例模式用途很广,比如登录 ...
- 《JavaScript设计模式与开发实践》笔记第八章 发布-订阅模式
第八章 发布-订阅模式 发布-订阅模式描述 发布-订阅模式又叫观察者模式,它定义对象间的一种一对多的依赖关系,当一个对象的状态发生改变时,所有依赖于它的对象都将得到通知. 发布-订阅模式可以广泛应用于 ...
- 《JavaScript设计模式与开发实践》笔记第一章
第一章 面向对象的JavaScript 动态类型语言和鸭子类型 编程语言按照数据类型大体可以分为两类:静态类型语言.动态类型语言. 静态类型语言:在编译时便已确定变量的类型. 优点: 在编译时就能发现 ...
- javascript设计模式与开发实践阅读笔记(5)——策略模式
策略模式:定义一系列的算法,把它们一个个封装起来,并且使它们可以相互替换. 我的理解就是把各种方法封装成函数,同时存在一个可以调用这些方法的公共函数.这样做的好处是可以消化掉内部的分支判断,使代码效率 ...
随机推荐
- HOOK自绘原理 good
做“HOOK文件打开/保存对话框”的过程中,我首先研究了界面库的相关知识.界面库一般都是由C/C++这种中低级语言编码,这是因为在Windows下的界面库实现技术大都以直接操作控制Windows的消息 ...
- 深入理解Arrays.sort() (转)
Arrays.sort(T[], Comparator < ? super T > c) 方法用于对象数组按用户自定义规则排序.官方Java文档只是简要描述此方法的作用,并未进行详细的介绍 ...
- Boost下载安装编译配置使用指南(含Windows和Linux
理论上,本文适用于boost的各个版本,尤其是最新版本1.45.0:适用于各种C++编译器,如VC6.0(部分库不支持),VS2003,VS2005,VS2008,gcc,C++ Builder等.先 ...
- Swift Swift语言Storyboard教程:第二部
本文由CocoaChina翻译小组@TurtleFromMars翻译自raywenderlich,原文:Storyboards Tutorial in Swift: Part 2 更新记录:该Stor ...
- 【Demo 0003】Java基础-数组
本章学习要点: 1. 了解数组的基本概念: 2. 掌握数组使用方法: 一.数组的基本概念 1. 数组定义: 同一数据类型数据的集合,在 ...
- HDU 4296 Buildings (YY)
题意: 给定N个物体,每个物体有两个参数w,s. w代表它自身的重量: s代表它的强度.现在要把这些物体叠在一起,会产生一个PDV值. PDV解释:(Σwj)-si, where (Σwj) st ...
- 百度搜索结果页url参数详解
在百度首页输入任意关键词搜索之后,我们跳转到搜索结果页面,在浏览器的网址栏我们可以看到很长的一串url地址.那么,你真的了解这一串url的含义吗? s?:搜索 百度搜索结果页使用了重定向,因此我们看到 ...
- PHP中抽象类与接口的应用场景
<?php /*** ====笔记部分==== 接口的具体语法: 0:以人类为, class Human 是人的草图 而接口 是零件 可以用多种零件组合出一种新特种来. 1: 如上,接口本身即是 ...
- 与众不同 windows phone (30) - Communication(通信)之基于 Socket TCP 开发一个多人聊天室
原文:与众不同 windows phone (30) - Communication(通信)之基于 Socket TCP 开发一个多人聊天室 [索引页][源码下载] 与众不同 windows phon ...
- WebSocket是一种协议
WebSocket,并非HTML 5独有,WebSocket是一种协议.只是在handshake的时候,发送的链接信息头和HTTP相似.HTML 5只是实现了WebSocket的客户端.其实,难点在于 ...