当前位置: 首页 > news >正文

每天一个设计模式之命令模式

作者按:《每天一个设计模式》旨在初步领会设计模式的精髓,目前采用 javascriptpython两种语言实现。诚然,每种设计模式都有多种实现方式,但此小册只记录最直截了当的实现方式 :)

原文地址是:《每天一个设计模式之命令模式》

欢迎关注个人技术博客:godbmw.com。每周 1 篇原创技术分享!开源教程(webpack、设计模式)、面试刷题(偏前端)、知识整理(每周零碎),欢迎长期关注!

如果您也想进行知识整理 + 搭建功能完善/设计简约/快速启动的个人博客,请直接戳theme-bmw

0. 示例代码

  • 此节全部代码
  • 《每天一个设计模式》地址

1. 什么是“命令模式”?

命令模式是一种数据驱动的设计模式,它属于行为型模式。
  1. 请求以命令的形式包裹在对象中,并传给调用对象。
  2. 调用对象寻找可以处理该命令的合适的对象,并把该命令传给相应的对象。
  3. 该对象执行命令。

在这三步骤中,分别有 3 个不同的主体:发送者、传递者和执行者。在实现过程中,需要特别关注。

2. 应用场景

有时候需要向某些对象发送请求,但是又不知道请求的接受者是谁,更不知道被请求的操作是什么。此时,命令模式就是以一种松耦合的方式来设计程序

3. 代码实现

3.1 python3 实现

命令对象将动作的接收者设置在属性中,并且对外暴露了execute接口(按照习惯约定)。

在其他类设置命令并且执行命令的时候,只需要按照约定调用Command对象的execute()即可。到底是谁接受命令,并且怎么执行命令,都交给Command对象来处理!

__author__ = 'godbmw.com'

# 接受到命令,执行具体操作
class Receiver(object):
  def action(self):
    print("按钮按下,执行操作")

# 命令对象
class Command:
  def __init__(self, receiver):
    self.receiver = receiver

  def execute(self):
    self.receiver.action()

# 具体业务类
class Button:
  def __init__(self):
    self.command = None

  # 设置命令对戏那个
  def set_command(self, command):
    self.command = command

  # 按下按钮,交给命令对象调用相关函数
  def down(self):
    if not self.command:
      return
    self.command.execute()

if __name__ == "__main__":

  receiver = Receiver()

  command = Command(receiver)

  button = Button()
  button.set_command(command)
  button.down()

3.2 ES6 实现

setCommand方法为按钮指定了命令对象,命令对象为调用者(按钮)找到了接收者(MenuBar),并且执行了相关操作。而按钮本身并不需要关心接收者和接受操作

// 接受到命令,执行相关操作
const MenuBar = {
  refresh() {
    console.log("刷新菜单页面");
  }
};

// 命令对象,execute方法就是执行相关命令
const RefreshMenuBarCommand = receiver => {
  return {
    execute() {
      receiver.refresh();
    }
  };
};

// 为按钮对象指定对应的 对象
const setCommand = (button, command) => {
  button.onclick = () => {
    command.execute();
  };
};

let refreshMenuBarCommand = RefreshMenuBarCommand(MenuBar);
let button = document.querySelector("button");
setCommand(button, refreshMenuBarCommand);

下面是同级目录的 html 代码,在谷歌浏览器中打开创建的index.html,并且打开控制台,即可看到效果。

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <meta http-equiv="X-UA-Compatible" content="ie=edge" />
    <title>命令模式</title>
  </head>
  <body>
    <button>按钮</button>
    <script src="./main.js"></script>
  </body>
</html>

4. 参考

  • 《JavaScript 设计模式和开发实践》
  • 如何实现命令模式

相关文章:

  • ESXi虚拟机的磁盘格式
  • Nmap的详细使用
  • js 如何判断数组元素是否存在重复项
  • Kubernetes高可用负载均衡与集群外服务访问实践
  • K8S-网络模型、POD/RC/SVC YAML 语法官方文档
  • C# 图解教程 第四章 类的基本概念
  • [译] Android 内核控制流完整性
  • codeforces 1093 题解
  • IIS 设备未就绪。
  • 性能常用指标(重点)
  • python的内存回收机制即gc模块讲解
  • 前端工程师的 2018 年总结 | 掘金年度征文
  • 剑指 linux、docker、k8s
  • 快手服务治理平台KESS的设计理念和实战
  • 服务器巡检常用命令,脚本,及调优思路
  • ----------
  • [PHP内核探索]PHP中的哈希表
  • 【技术性】Search知识
  • 〔开发系列〕一次关于小程序开发的深度总结
  • angular组件开发
  • axios请求、和返回数据拦截,统一请求报错提示_012
  • C++类的相互关联
  • Zsh 开发指南(第十四篇 文件读写)
  • 爱情 北京女病人
  • 等保2.0 | 几维安全发布等保检测、等保加固专版 加速企业等保合规
  • 如何用Ubuntu和Xen来设置Kubernetes?
  • 腾讯视频格式如何转换成mp4 将下载的qlv文件转换成mp4的方法
  • 微信公众号开发小记——5.python微信红包
  • 微信小程序--------语音识别(前端自己也能玩)
  • 我是如何设计 Upload 上传组件的
  • 硬币翻转问题,区间操作
  • 在Unity中实现一个简单的消息管理器
  • 怎么把视频里的音乐提取出来
  • 栈实现走出迷宫(C++)
  • 智能合约开发环境搭建及Hello World合约
  • [地铁译]使用SSD缓存应用数据——Moneta项目: 低成本优化的下一代EVCache ...
  • ###C语言程序设计-----C语言学习(6)#
  • (1) caustics\
  • (2)(2.10) LTM telemetry
  • (bean配置类的注解开发)学习Spring的第十三天
  • (C语言)球球大作战
  • (C语言版)链表(三)——实现双向链表创建、删除、插入、释放内存等简单操作...
  • (Matlab)基于蝙蝠算法实现电力系统经济调度
  • (ZT)北大教授朱青生给学生的一封信:大学,更是一个科学的保证
  • (附源码)计算机毕业设计SSM疫情下的学生出入管理系统
  • (免费分享)基于springboot,vue疗养中心管理系统
  • (强烈推荐)移动端音视频从零到上手(上)
  • (十一)c52学习之旅-动态数码管
  • (四)模仿学习-完成后台管理页面查询
  • (算法)前K大的和
  • (万字长文)Spring的核心知识尽揽其中
  • (转载)VS2010/MFC编程入门之三十四(菜单:VS2010菜单资源详解)
  • .NET/C# 中设置当发生某个特定异常时进入断点(不借助 Visual Studio 的纯代码实现)
  • .Net6使用WebSocket与前端进行通信
  • .NetCore Flurl.Http 升级到4.0后 https 无法建立SSL连接