摘要:中的命令模式點擊按鈕刷新菜單目錄設置背景色的例子撤銷命令我們現在來實現一個撤銷操作的例子界面上有四個按鈕,三個可以設置不同的背景色,按鈕可以撤銷上一次的操作重做操作這里我們增加一個按鈕,以恢復之前的操作,需要一個來記錄當前的索引
前言
本系列文章主要根據《JavaScript設計模式與開發實踐》整理而來,其中會加入了一些自己的思考。希望對大家有所幫助。
文章系列js設計模式--單例模式
js設計模式--策略模式
js設計模式--代理模式
js設計模式--迭代器模式
js設計模式--發布訂閱模式
概念命令模式中的命令(command)指的是一個執行某些特定事情的指令。
場景有時候需要向某些對象發送請求,但是并不知道請求的接收 者是誰,也不知道被請求的操作是什么。
如快餐店點餐,我們不需要知道廚師是誰,我們只需要把訂單交給服務員
請求發送者和請求接收者能夠消除彼此之間的耦合關系
例子 按鈕點擊 簡單的實現Document
如果這個點擊事件實現很復雜,需要多人合作完成,那我們不得不深入到button1.onclick內部去修改代碼,違背了開放封閉原則
命令模式實現Document
JavaScript 作為將函數作為一等對象的語言,跟策略模式一樣,命令模式也早已融入到了 JavaScript 語言之中。
js中的命令模式設置背景色的例子 撤銷命令Document
我們現在來實現一個撤銷操作的例子:
界面上有四個按鈕,三個可以設置不同的背景色,undo按鈕可以撤銷上一次的操作
重做操作Document
這里我們增加一個redo按鈕,以恢復之前的操作,需要一個currentIndex來記錄當前的索引
Document
文章版權歸作者所有,未經允許請勿轉載,若此文章存在違規行為,您可以聯系管理員刪除。
轉載請注明本文地址:http://specialneedsforspecialkids.com/yun/100688.html
摘要:命令設計模式涉及三類對象抽象命令類抽象命令類一般是一個抽象類或接口,在其中聲明了用于執行請求的等方法,通過這些方法可以調用請求接收者的相關操作。 命令模式 命令模式定義為:Encapsulate a request as an object,there by letting you parameterize clients with different requests,queue o...
摘要:撤銷重做是一款編輯器的基礎功能,它讓用戶在進行錯誤操作后,可以讓編輯器回滾到錯誤操作前的狀態。選擇實現方案基于對象序列化的實現功能,其中一個方法是基于對象序列化的。示例編輯器的撤銷重做功能使用了這種模式。 最近在做一個網頁版的 svg 編輯器,為此學習了編輯器相關方面的知識。本文是我的一些粗淺學習總結,希望可以給初學者一些思路。 前面的話 隨著近幾年前端技術的快速發展,人們更傾向于將應...
摘要:大部分前端應用都部署在上,若想全局住一個項目,命令是一項必不可少的技能。編輯器命令非常強大,掌握最最基本的就可以解決問題了。命令模式下接受命令輸入且顯示在終端,回車生效。常見的命令有,退出,強制退出,保存,保存并退出。 大部分前端應用都部署在linux上,若想全局hold住一個項目,linux命令是一項必不可少的技能。許多前端對linux命令并不重視,其實這是一個學習性價比非常高的知識...
摘要:前言近期在準備搭建一個全棧開發的社區,之前由于沒有云服務器搭建經驗,這篇文章做一下相關的記錄,后續再深入學習研究?;蛴脩舻卿浽品掌?,直接使用命令進行連接,如云服務器公網,然后輸入用戶的初始密碼,即可完成登錄。云服務器的端口,必須填。 前言 近期在準備搭建一個vue.js+node.js全棧開發的社區,之前由于沒有云服務器搭建經驗,這篇文章做一下相關的記錄,后續再深入學習研究。本文不局...
閱讀 3287·2021-11-25 09:43
閱讀 2089·2021-09-22 10:02
閱讀 3338·2021-09-06 15:00
閱讀 2301·2019-08-30 15:56
閱讀 2353·2019-08-30 15:54
閱讀 3230·2019-08-30 14:14
閱讀 2263·2019-08-29 17:25
閱讀 2906·2019-08-29 17:16