概念
将请求封装成对象,分离命令接受者和发起者之间的耦合。 命令执行之前在执行对象中传入接受者。
目的
- 相互之间的解耦(即分离发起者与接收者之间的耦合关系)
特点
- 发起者 :发出调用命令即可,具体如何执行,谁执行并不需要清楚
- 接受者:有对应的接口处理不同的命令,至于命令是什么,谁发出的,不用关心
- 命令对象:上面讲发起者和接受者分开了,二者之间需要个连接桥梁。这就是命令对象。命令对象接受发送者的调用,然后调用接受者的相应接口。(命令模式的命令指的是一个执行某些特定事情的指令)
如图
意思就是发起者不需要知道接受者是谁,怎么执行,怎么完成的过程,发起者只需要发布命令就行
同理接收者也不需要知道发布者是谁,为什么发布,他只接收到命令的对象
生活中例子
- 例一
前端已经开发完了页面,需要进行数据接口联调,然后后端直接给了一份接口文档给前端,
于是前端就不需要找后端了,也不需要知道是哪个后端开发的这些接口,自己就能按着开发文档进行
开发了(嘿嘿...前提是后端接口文档定义清晰了),这里的接口文档其实就相当于命令对象,
把后端和前端进行分开,他接收后端的接口,然后发给前端进行接口调用
- 例二
如果还不理解,这里有一段摘抄自<<JavaScript设计模式与开发实战>>
假设有一个快餐店,而我是该餐厅的点餐服务员,那么我一天的工作应该是这样的:当某位
客人点餐或者打来订餐电话后,我会把他的需求都写在清单上,然后交给厨房,客人不用关心是
哪些厨师帮他炒菜。我们餐厅还可以满足客人需要的定时服务,比如客人可能当前正在回家的路
上,要求 1个小时后才开始炒他的菜,只要订单还在,厨师就不会忘记。客人也可以很方便地打
电话来撤销订单。另外如果有太多的客人点餐,厨房可以按照订单的顺序排队炒菜。
这些记录着订餐信息的清单,便是命令模式中的命令对象。
实例
如进行一个按钮的点击,发布者发送一个命令,然后通知接收者进行工作
<!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>Document</title>
</head>
<body>
<p id="number">0</p>
<button id="addBtn">+</button>
</body>
<script>
let number = document.getElementById("number");
// 接受者
let worker = {
add(){
let oldVal = isNaN(number.innerHTML)?0:parseInt(number.innerHTML)
number.innerHTML = oldVal+1
}
}
// 命令
class AddCommand{
constructor(recevier){
this.recevier = recevier
}
execute(){
this.recevier .add()
}
}
let addCommand = new AddCommand(worker)
// 发布者
document.getElementById("addBtn").addEventListener("click",()=>addCommand.execute())
</script>
</html>