JavaScript中的命令模式

184 阅读1分钟

介绍

※ 执行命令时,发布者和执行者分开

※ 中间加入命令对象,作为中转站

实现代码(ES6)

// 接受者

class Receiver{
    exec(){
        console.log('执行')
    }
}

//命令者

class Command {
    constructor(receiver){
        this.receiver = receiver
    }
    cmd(){
        console.log('执行命令')
        this.receiver.exec()
    }
}
//触发者
class Invoker {
    constructor(command){
        this.command = command
    }
    invoke(){
        console.log('开始')
        this.command.cmd()
    }
}

//士兵
let soldier = new Receiver()
// 小号手
let trumpeter = new Command(soldier)
//将军
let general = new Invoker(trumpeter)

general.invoke()

JS中的应用

◆ 网页富文本编辑器操作,浏览器封装了一个命令对象

◆ document.execCommand('bold')

◆ document.execCommand('undo')

设计原则

● 命令对象于执行对象分开,解耦

● 符合开放封闭原则