资讯专栏INFORMATION COLUMN

javascript 命令模式

gyl_coder / 3294人阅读

摘要:中的命令模式命令模式在中也比较简单下面代码中对按钮和命令进行了抽离因此可以复杂项目中可以使用命令模式将界面的代码和功能的代码交付给不同的人去写。上面的界面逻辑由完成下面的由完成更新菜单创建命令

JavaScript 中的命令模式

命令模式在 JavaScript 中也比较简单, 下面代码中对按钮和命令进行了抽离, 因此可以复杂项目中可以使用命令模式将界面的代码和功能的代码交付给不同的人去写。

const setCommand = function(button, command) {
 button.onclick = function() {
 command.excute()
 }
 }

 // -------------------- 上面的界面逻辑由A完成, 下面的由B完成

 const menu = {
 updateMenu: function() {
 console.log("更新菜单")
 },
 }

 const UpdateCommand = function(receive) {
 return {
 excute: receive.updateMenu,
 }
 }

 const updateCommand = UpdateCommand(menu) // 创建命令

 const button1 = document.getElementById("button1")
 setCommand(button1, updateCommand)
  

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/106610.html

相关文章

  • JavaScript设计模式(七):命令模式

    摘要:支持撤销,队列,宏命令等功能。宏命令宏命令一组命令集合命令模式与组合模式的产物发布者发布一个请求,命令对象会遍历命令集合下的一系列子命令并执行,完成多任务。 showImg(https://segmentfault.com/img/bVbu3CN?w=800&h=600); 命令模式:请求以命令的形式包裹在对象中,并传给调用对象。调用对象寻找可以处理该命令的合适的对象,并把该命令传给相...

    lixiang 评论0 收藏0
  • javascript设计模式学习笔记之命令模式

    摘要:命令模式指的是一个执行某些特定事情的指令设计模式的主题总是把不变的事物和变化的事物分离开来在中函数作为一等对象所以命令模式其实是回调函数的一个面向对象的替代品设置命令命令集合刷新菜单界面命令触发条件接受者绑定命令 命令模式 指的是一个执行某些特定事情的指令 设计模式的主题: 总是把不变的事物和变化的事物分离开来 在javascript 中, 函数作为一等对象, 所以, 命令模式其实是...

    MobService 评论0 收藏0
  • JavaScript中常用的设计模式

    摘要:本文已同步到中常见的设计模式如果感觉写的还可以,就给个小星星吧,欢迎和收藏。本文中关于各种设计模式定义都是引用书中的,部分引用自百度百科已标出。下面把我整理出的常用设计模式按类型做个表格整理。 本文已同步到Github JavaScript中常见的设计模式,如果感觉写的还可以,就给个小星星吧,欢迎star和收藏。 最近拜读了曾探大神的《JavaScript设计模式与开发实践》,真是醍醐...

    NSFish 评论0 收藏0
  • js设计模式--命令模式

    摘要:中的命令模式点击按钮刷新菜单目录设置背景色的例子撤销命令我们现在来实现一个撤销操作的例子界面上有四个按钮,三个可以设置不同的背景色,按钮可以撤销上一次的操作重做操作这里我们增加一个按钮,以恢复之前的操作,需要一个来记录当前的索引 前言 本系列文章主要根据《JavaScript设计模式与开发实践》整理而来,其中会加入了一些自己的思考。希望对大家有所帮助。 文章系列 js设计模式--单例模...

    Bryan 评论0 收藏0
  • 前端练级攻略(第二部分)

    摘要:是文档的一种表示结构。这些任务大部分都是基于它。这个实践的重点是把你在前端练级攻略第部分中学到的一些东西和结合起来。一旦你进入框架部分,你将更好地理解并使用它们。到目前为止,你一直在使用进行操作。它是在前端系统像今天这样复杂之前编写的。 本文是 前端练级攻略 第二部分,第一部分请看下面: 前端练级攻略(第一部分) 在第二部分,我们将重点学习 JavaScript 作为一种独立的语言,如...

    BWrong 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<