国产探花免费观看_亚洲丰满少妇自慰呻吟_97日韩有码在线_资源在线日韩欧美_一区二区精品毛片,辰东完美世界有声小说,欢乐颂第一季,yy玄幻小说排行榜完本

首頁 > 編程 > JavaScript > 正文

輕松掌握J(rèn)avaScript中介者模式

2019-11-20 09:08:52
字體:
供稿:網(wǎng)友

中介者模式的作用就是解除對象與對象之間的緊耦合關(guān)系,它也稱‘調(diào)停者'。所有的對象都通過中介者對象來通信,而不是相互引用,所以當(dāng)一個對象發(fā)生改變時,只需要通知中介者即可。 

如:機(jī)場的指揮塔,每架飛機(jī)都只需要和指揮塔通信即可,指揮塔知道每架飛機(jī)的飛行狀況,可以安排所有起降時間,調(diào)整航線等 

中介者模式符合迪米特法則,即最少知識原則,指一個對象應(yīng)該盡可能少地了解另外的對象。如果對象之間的耦合性太高,則改變一個對象,會牽動很多對象,難于維護(hù)。當(dāng)對象耦合很緊時,要修改一個對象而不影響其它的對象是很困難的。 

如果對象之間的復(fù)雜耦合確實導(dǎo)致調(diào)用和維護(hù)出現(xiàn)了困難,而且這些耦合度隨項目的變化呈指數(shù)增長,那我們就可以考慮用中介者模式來重構(gòu)代碼!中介者通過解耦來提升代碼的可維護(hù)性。 

例子1:游戲 
玩家對象是通過Player()構(gòu)造函數(shù)來創(chuàng)建的,有自己的points和name屬性。原型上的play()方法負(fù)責(zé)給自己加一分然后通知中介者:

 function Player(name) {  this.points = 0;  this.name = name;}Player.prototype.play = function () {  this.points += 1;  mediator.played();}; 

scoreboard對象(計分板)有一個update()方法,它會在每次玩家玩完后被中介者調(diào)用。計分析根本不知道玩家的任何信息,也不保存分?jǐn)?shù),它只負(fù)責(zé)顯示中介者給過來的分?jǐn)?shù):

 var scoreboard = {  element: document.getElementById('results'),  update: function (score) {    var i, msg = '';    for (i in score) {      if (score.hasOwnProperty(i)) {        msg += '<p><strong>' + i + '<//strong>: ';        msg += score[i];        msg += '<//p>';      }    }    this.element.innerHTML = msg;  }}; 

現(xiàn)在我們來看一下mediator對象(中介者)。在游戲初始化的時候,在setup()方法中創(chuàng)建游戲者,然后放后players屬性以便后續(xù)使用。played()方法會被游戲者在每輪玩完后調(diào)用,它更新score哈希然表然后將它傳給scoreboard用于顯示。最后一個方法是keypress(),負(fù)責(zé)處理鍵盤事件,決定是哪位玩家玩的,并且通知它:

 var mediator = {  players: {},  setup: function () {    var players = this.players;    players.home = new Player('Home');    players.guest = new Player('Guest');  },  played: function () {    var players = this.players,    score = {      Home: players.home.points,      Guest: players.guest.points    };    scoreboard.update(score);  },  keypress: function (e) {    e = e || window.event; // IE    if (e.which === 49) { // key "1"      mediator.players.home.play();      return;    }    if (e.which === 48) { // key "0"      mediator.players.guest.play();      return;    }  }}; 

最后一件事是初始化和結(jié)束游戲:

 // go!mediator.setup();window.onkeypress = mediator.keypress;// game over in 30 secondssetTimeout(function () {  window.onkeypress = null;  alert('Game over!');}, 30000); 

例子2:賣手機(jī)

 var goods = {  //庫存  'red|32G':3,  'red|16G':5,  'blue|32G':3,  'blue|16G':6}//中介者var mediator = (function(){  function id(id){    return document.getElementById(id);  }  var colorSelect = id('colorSelect'),    memorySelect = id('memorySelect'),    numberInput = id('numberInput'),    colorInfo = id('colorInfo'),    memoryInfo = id('memoryInfo'),    numberInfo = id('numberInfo'),    nextBtn = id('nextBtn');  return{    changed:function(obj){      var color = colorSelect.value,        memory = memorySelect.value,        number = numberInput.value,        stock = goods[color+'|'+memory];      if(obj === colorSelect){        colorInfo.innerHTML = color;      }else if(obj === memorySelect){        memoryInfo.innerHTML = memory;      }else if(obj === numberInput){        numberInfo.innerHTML = number;      }      if(!color){        nextBtn.disabled = true;        nextBtn.innerHTML = '請選擇手機(jī)顏色';        return;      }      if(!memory){        nextBtn.disabled = true;        nextBtn.innerHTML = '請選擇內(nèi)存大小';        return;      }      if(Number.isInteger(number-0) && number > 0){        nextBtn.disabled = true;        nextBtn.innerHTML = '請輸入正確的購買數(shù)量';        return;      }      nextBtn.disabled = false;      nextBtn.innerHTML = '放入購物車';    }  }})();//添加事件colorSelect.onchange = function(){  mediator.changed(this);}memorySelect.onchange = function(){  mediator.changed(this);}numberInput.onchange = function(){  mediator.changed(this);} 

參考文獻(xiàn): 《JavaScript模式》 《JavaScript設(shè)計模式與開發(fā)實踐》

以上就是本文的全部內(nèi)容,希望對大家的學(xué)習(xí)有所幫助,也希望大家多多支持武林網(wǎng)。

發(fā)表評論 共有條評論
用戶名: 密碼:
驗證碼: 匿名發(fā)表
主站蜘蛛池模板: 三门峡市| 和平县| 松溪县| 翁源县| 柯坪县| 建水县| 紫云| 辽阳市| 炉霍县| 新乐市| 抚宁县| 景泰县| 晋城| 若羌县| 林州市| 罗源县| 无棣县| 铁岭市| 忻城县| 南郑县| 稷山县| 婺源县| 黎平县| 左贡县| 故城县| 印江| 搜索| 宁波市| 烟台市| 大同县| 清镇市| 古蔺县| 德庆县| 福泉市| 泰来县| 梁平县| 理塘县| 北流市| 阳曲县| 元江| 类乌齐县|