摘要：支持撤銷(xiāo)，隊(duì)列，宏命令等功能。宏命令宏命令一組命令集合命令模式與組合模式的產(chǎn)物發(fā)布者發(fā)布一個(gè)請(qǐng)求，命令對(duì)象會(huì)遍歷命令集合下的一系列子命令并執(zhí)行，完成多任務(wù)。

命令模式：請(qǐng)求以命令的形式包裹在對(duì)象中，并傳給調(diào)用對(duì)象。調(diào)用對(duì)象尋找可以處理該命令的合適的對(duì)象，并把該命令傳給相應(yīng)的對(duì)象，該對(duì)象執(zhí)行命令。

生活小栗子：客戶(hù)下單，訂單記錄了客戶(hù)購(gòu)買(mǎi)的產(chǎn)品，倉(cāng)庫(kù)根據(jù)訂單給客戶(hù)備貨。

命令模式由三種角色構(gòu)成：

發(fā)布者 invoker（發(fā)出命令，調(diào)用命令對(duì)象，不知道如何執(zhí)行與誰(shuí)執(zhí)行）；

接收者 receiver (提供對(duì)應(yīng)接口處理請(qǐng)求，不知道誰(shuí)發(fā)起請(qǐng)求）；

命令對(duì)象 command（接收命令，調(diào)用接收者對(duì)應(yīng)接口處理發(fā)布者的請(qǐng)求）。

發(fā)布者 invoker 和接收者 receiver 各自獨(dú)立，將請(qǐng)求封裝成命令對(duì)象 command ，請(qǐng)求的具體執(zhí)行由命令對(duì)象 command 調(diào)用接收者 receiver 對(duì)應(yīng)接口執(zhí)行。

命令對(duì)象 command 充當(dāng)發(fā)布者 invoker 與接收者 receiver 之間的連接橋梁（中間對(duì)象介入）。實(shí)現(xiàn)發(fā)布者與接收之間的解耦，對(duì)比過(guò)程化請(qǐng)求調(diào)用，命令對(duì)象 command 擁有更長(zhǎng)的生命周期，接收者 receiver 屬性方法被封裝在命令對(duì)象 command 屬性中，使得程序執(zhí)行時(shí)可任意時(shí)刻調(diào)用接收者對(duì)象 receiver 。因此 command 可對(duì)請(qǐng)求進(jìn)行進(jìn)一步管控處理，如實(shí)現(xiàn)延時(shí)、預(yù)定、排隊(duì)、撤銷(xiāo)等功能。

class Receiver {  // 接收者類(lèi)
  execute() {
    console.log("接收者執(zhí)行請(qǐng)求");
  }
}

class Command {   // 命令對(duì)象類(lèi)
  constructor(receiver) {
    this.receiver = receiver;
  }
  execute () {    // 調(diào)用接收者對(duì)應(yīng)接口執(zhí)行
    console.log("命令對(duì)象->接收者->對(duì)應(yīng)接口執(zhí)行");
    this.receiver.execute();
  }
}

class Invoker {   // 發(fā)布者類(lèi)
  constructor(command) {
    this.command = command;
  }
  invoke() {      // 發(fā)布請(qǐng)求，調(diào)用命令對(duì)象
    console.log("發(fā)布者發(fā)布請(qǐng)求");
    this.command.execute();
  }
}

const warehouse = new Receiver();       // 倉(cāng)庫(kù)
const order = new Command(warehouse);   // 訂單
const client = new Invoker(order);      // 客戶(hù)
client.invoke();

/*
輸出：
  發(fā)布者發(fā)布請(qǐng)求
  命令對(duì)象->接收者->對(duì)應(yīng)接口執(zhí)行
  接收者執(zhí)行請(qǐng)求
*/

有時(shí)候需要向某些對(duì)象發(fā)送請(qǐng)求，但是并不知道請(qǐng)求的接收者是誰(shuí)，也不知道被請(qǐng)求的操作是什么。需要一種松耦合的方式來(lái)設(shè)計(jì)程序，使得發(fā)送者和接收者能夠消除彼此之間的耦合關(guān)系。
——《JavaScript 設(shè)計(jì)模式與開(kāi)發(fā)實(shí)踐》

不關(guān)注執(zhí)行者，不關(guān)注執(zhí)行過(guò)程；

只要結(jié)果，支持撤銷(xiāo)請(qǐng)求、延后處理、日志記錄等。

優(yōu)點(diǎn)：

發(fā)布者與接收者實(shí)現(xiàn)解耦；

可擴(kuò)展命令，對(duì)請(qǐng)求可進(jìn)行排隊(duì)或日志記錄。（支持撤銷(xiāo)，隊(duì)列，宏命令等功能）。

缺點(diǎn)：

額外增加命令對(duì)象，非直接調(diào)用，存在一定開(kāi)銷(xiāo)。

宏命令：一組命令集合（命令模式與組合模式的產(chǎn)物）

發(fā)布者發(fā)布一個(gè)請(qǐng)求，命令對(duì)象會(huì)遍歷命令集合下的一系列子命令并執(zhí)行，完成多任務(wù)。

// 宏命令對(duì)象
class MacroCommand {
  constructor() {
    this.commandList = [];  // 緩存子命令對(duì)象
  }
  add(command) {            // 向緩存中添加子命令
    this.commandList.push(command);
  }
  exceute() {               // 對(duì)外命令執(zhí)行接口
    // 遍歷自命令對(duì)象并執(zhí)行其 execute 方法
    for (const command of this.commandList) {
      command.execute();
    }
  }
}

const openWechat = {  // 命令對(duì)象
  execute: () => {
    console.log("打開(kāi)微信");
  }
};

const openChrome = {  // 命令對(duì)象
  execute: () => {
    console.log("打開(kāi)Chrome");
  }
};

const openEmail = {   // 命令對(duì)象
  execute: () => {
    console.log("打開(kāi)Email");
  }
}

const macroCommand = new MacroCommand();

macroCommand.add(openWechat); // 宏命令中添加子命令
macroCommand.add(openChrome); // 宏命令中添加子命令
macroCommand.add(openEmail);  // 宏命令中添加子命令

macroCommand.execute();       // 執(zhí)行宏命令
/* 輸出：
打開(kāi)微信
打開(kāi)Chrome
打開(kāi)Email
*/

傻瓜命令：命令對(duì)象需要接收者來(lái)執(zhí)行客戶(hù)的請(qǐng)求。
智能命令：命令對(duì)象直接實(shí)現(xiàn)請(qǐng)求，不需要接收者，“聰明”的命令對(duì)象。

“傻瓜命令” 與 “智能命令” 的區(qū)別在于是否有 “接收者” 對(duì)象。

// openWechat 是智能命令對(duì)象，并沒(méi)有傳入 receiver 接收對(duì)象
const openWechat = {
  execute: () => {  // 命令對(duì)象直接處理請(qǐng)求
    console.log("打開(kāi)微信");
  }
};

沒(méi)有 “接收者” 的智能命令與策略模式很類(lèi)似。代碼實(shí)現(xiàn)類(lèi)似，區(qū)別在于實(shí)現(xiàn)目標(biāo)不同。

策略模式中實(shí)現(xiàn)的目標(biāo)是一致的，只是實(shí)現(xiàn)算法不同（如目標(biāo)：根據(jù)KPI計(jì)算獎(jiǎng)金)；

智能命令的解決問(wèn)題更廣，目標(biāo)更具散發(fā)性。(如目標(biāo)：計(jì)算獎(jiǎng)金/計(jì)算出勤率等)。

參考文章

《JavaScript 設(shè)計(jì)模式與開(kāi)發(fā)實(shí)踐》

本文首發(fā)Github，期待Star！
https://github.com/ZengLingYong/blog

作者：以樂(lè)之名
本文原創(chuàng)，有不當(dāng)?shù)牡胤綒g迎指出。轉(zhuǎn)載請(qǐng)指明出處。