javascript設(shè)計(jì)模式 – 命令模式原理與用法實(shí)例分析
本文實(shí)例講述了javascript設(shè)計(jì)模式 – 命令模式原理與用法。分享給大家供大家參考,具體如下:
介紹:命令模式是一種數(shù)據(jù)驅(qū)動(dòng)的設(shè)計(jì)模式,將請(qǐng)求以命令的形式包裹在對(duì)象中,并傳遞給調(diào)用對(duì)象。命令模式的核心在于引入了命令類,通過命令類來降低發(fā)送者和接受者的耦合度。
定義:將一個(gè)請(qǐng)求封裝為一個(gè)對(duì)象,從而可用不同的請(qǐng)求對(duì)客戶進(jìn)行參數(shù)化;對(duì)請(qǐng)求排隊(duì)或者記錄請(qǐng)求日志,以及支持可撤銷的操作。命令模式是一種對(duì)象行為型模式,其別名為動(dòng)作(Action)模式或事務(wù)(Transaction)模式。
場(chǎng)景:我們通過買賣股票的場(chǎng)景來實(shí)現(xiàn)下命令模式,
示例:
var Stock = function(){ this.name = 'baidu'; this.quantity = 100; this.buy = function(){ console.log('購(gòu)買了:' + this.quantity + '股' + this.name); } this.sell = function(){ console.log('賣出了:' + this.quantity + '股' + this.name); } } var BuyStock = function(stock){ this.stock = stock; this.execute = function(){ this.stock.buy(); } } var SellStock = function(stock){ this.stock = stock; this.execute = function(){ this.stock.sell(); } } var Broker = function(){ this.orderList = []; this.takeOrder = function(order){ this.orderList.push(order); } this.placeOrders = function(){ this.orderList.map(function(item){ item.execute(); }) this.orderList = []; } } var stock = new Stock(); var buyStock = new BuyStock(stock); var sellStock = new SellStock(stock); var broker = new Broker(); broker.takeOrder(buyStock); broker.takeOrder(sellStock); broker.placeOrders(); // 購(gòu)買了:100股baidu // 賣出了:100股baidu
這個(gè)例子里面SellStock,BuyStock為命令類,執(zhí)行實(shí)際的命令。Broker用來接收命令,并在指定的時(shí)機(jī)執(zhí)行命令。Stock為請(qǐng)求受體,
回頭看下定義:sellStock,buyStock就是將命令封裝好的對(duì)象,你可以通過對(duì)象的execute方法執(zhí)行該命令。通過擴(kuò)展placeOrders方法可以支持請(qǐng)求隊(duì)列或者記錄請(qǐng)求日志,以及支持可撤銷等操作
命令模式總結(jié):
優(yōu)點(diǎn):
* 降低系統(tǒng)耦合度
* 新的命令很容易的加入到系統(tǒng)中
缺點(diǎn):
* 使用命令模式可能會(huì)導(dǎo)致某些系統(tǒng)有過多的具體命令類
適用場(chǎng)景:
* 系統(tǒng)需要將請(qǐng)求調(diào)用者和請(qǐng)求接受者解耦
感興趣的朋友可以使用在線HTML/CSS/JavaScript代碼運(yùn)行工具:http://tools.jb51.net/code/HtmlJsRun測(cè)試上述代碼運(yùn)行效果。
更多關(guān)于JavaScript相關(guān)內(nèi)容感興趣的讀者可查看本站專題:《javascript面向?qū)ο笕腴T教程》、《JavaScript錯(cuò)誤與調(diào)試技巧總結(jié)》、《JavaScript數(shù)據(jù)結(jié)構(gòu)與算法技巧總結(jié)》、《JavaScript遍歷算法與技巧總結(jié)》及《JavaScript數(shù)學(xué)運(yùn)算用法總結(jié)》
希望本文所述對(duì)大家JavaScript程序設(shè)計(jì)有所幫助。
相關(guān)文章
next.js?getServerSideProps源碼解析
這篇文章主要為大家介紹了next.js?getServerSideProps源碼解析,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2022-10-10詳解Javascript中document.execCommand()的用法以及指令參數(shù)列表
execCommand方法是執(zhí)行一個(gè)對(duì)當(dāng)前文檔,當(dāng)前選擇或者給出范圍的命令。在HTML5中,execCommand可以通過JavaScript代碼來調(diào)用,使得開發(fā)者可以在網(wǎng)頁(yè)中實(shí)現(xiàn)一些復(fù)雜的文本操作。在HTML編輯器中這個(gè)命令用得很多,酷炫的強(qiáng)大功能。2023-07-07刪除數(shù)組條目中重復(fù)的條目(可能有多個(gè)),返回值是一個(gè)僅包含被刪除的重復(fù)條目的新數(shù)組。
刪除數(shù)組條目中重復(fù)的條目(可能有多個(gè)),返回值是一個(gè)僅包含被刪除的重復(fù)條目的新數(shù)組。...2007-09-09js阻止移動(dòng)端頁(yè)面滾動(dòng)的兩種方法
本文主要介紹了js阻止移動(dòng)端頁(yè)面滾動(dòng)的兩種方法。具有很好的參考價(jià)值,下面跟著小編一起來看下吧2017-01-01微信公眾平臺(tái)開發(fā)教程(四) 實(shí)例入門:機(jī)器人回復(fù)(附源碼)
本篇文章主要介紹了微信公眾平臺(tái)開發(fā)機(jī)器人,可以實(shí)現(xiàn)簡(jiǎn)單對(duì)話和查詢天氣等,有需要的可以了解一下。2016-12-12