您好,登錄后才能下訂單哦!
這篇文章給大家分享的是有關JS設計模式之命令模式的示例分析的內容。小編覺得挺實用的,因此分享給大家做個參考,一起跟隨小編過來看看吧。
客戶創建命令;調用者執行該命令;接收者在命令執行時執行相應操作
簡單命令對象一般用來消除二個對象(調用者和接收者)之間的耦合,而復雜的命令對象則一般用來封裝不可分的或事務性的指令。
命令模式的主要用途是把調用對象(用戶界面、API和代理等)與實現操作的對象隔離開。凡是兩個對象間互動方式需要有更高的模塊化程度時都可以用到這種模式。
命令的意思是用一個簡單方法或函數去執行和這個命令相關的實際操作。就如同用遙控器打開電視一樣,只按一個按鍵就可以打開電視,簡單、方便。它具體的實現操作我們不用關心。那是有電視器來處理的。電視對遙控器提供了一個接口(信號),遙控器只需要在點擊時實現這個接口就可以了。
Command:
定義命令的接口,聲明執行的方法。
ConcreteCommand:
命令接口實現對象,是“虛”的實現;通常會持有接收者,并調用接收者的功能來完成命令要執行的操作。
Receiver:
接收者,真正執行命令的對象。任何類都可能成為一個接收者,只要它能夠實現命令要求實現的相應功能。
Invoker:
要求命令對象執行請求,通常會持有命令對象,可以持有很多的命令對象。這個是客戶端真正觸發命令并要求命令執行相應操作的地方,也就是說相當于使用命令對象的入口。
Client:
創建具體的命令對象,并且設置命令對象的接收者。注意這個不是我們常規意義上的客戶端,而是在組裝命令對象和接收者,或許,把這個Client稱為裝配者會更好理解,因為真正使用命令的客戶端是從Invoker來觸發執行
模式分析
1.命令模式的本質是對命令進行封裝,將發出命令的責任和執行命令的責任分割開。
2.每一個命令都是一個操作:請求的一方發出請求,要求執行一個操作;接收的一方收到請求,并執行操作。
3.命令模式允許請求的一方和接收的一方獨立開來,使得請求的一方不必知道接收請求的一方的接口,更不必知道請求是怎么被接收,以及操作是否被執行、何時被執行,以及是怎么被執行的。
4.命令模式使請求本身成為一個對象,這個對象和其他對象一樣可以被存儲和傳遞。
5.命令模式的關鍵在于引入了抽象命令接口,且發送者針對抽象命令接口編程,只有實現了抽象命令接口的具體命令才能與接收者相關聯。
模式優點
1.降低對象之間的耦合度。
2.新的命令可以很容易地加入到系統中。
3.可以比較容易地設計一個組合命令。
4.調用同一方法實現不同的功能
// 命令 var CreateCommand = function( receiver ){ this.receiver = receiver; } CreateCommand.prototype.execute = function() { this.receiver.action(); } // 接收者 電視 var TVOn = function() {} TVOn.prototype.action = function() { alert("TVOn"); } // 接收者 電視 var TVOff = function() {} TVOff.prototype.action = function() { alert("TVOff"); } // 調用者 遙控器 var Invoker = function( tvOnCommand, tvOffCommand ) { this.tvOnCommand = tvOnCommand; this.tvOffCommand = tvOffCommand; } Invoker.prototype.tvOn = function() { this.tvOnCommand.execute(); } Invoker.prototype.tvOff = function() { this.tvOffCommand.execute(); }
執行Client
var tvOnCommand = new CreateCommand( new TVOn() ); var tvOffCommand = new CreateCommand( new TVOff() ); var invoker = new Invoker( tvOnCommand, tvOffCommand ); invoker.tvOn(); invoker.tvOff();
感謝各位的閱讀!關于“JS設計模式之命令模式的示例分析”這篇文章就分享到這里了,希望以上內容可以對大家有一定的幫助,讓大家可以學到更多知識,如果覺得文章不錯,可以把它分享出去讓更多的人看到吧!
免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。