Javascript设计模式-09-命令模式

Javascript设计模式 - 09 - 命令模式

简介

将执行的命令封装，解决命令发起者与命令执行者之间的耦合，每一条命令表示着一系列的操作，命令的使用者不必了解命令执行者的命令接口是如何实现的，只需要知道如何调用

用途

有的时候需要向某些对象发送请求，但是并不知道请求的接收者是谁，也不知被请求的操作是什么，此时希

JavaScript 作为将函数作为一等对象的语言，命令模式早已融入到语言中了

    var command = {
        click: function (msg) {
            console.log('click and do something', msg);
        },
        change: function (msg) {
            console.log('change and do something', msg);
        },
        blur: function (msg) {
            console.log('blur and do something', msg);
        },
        on: function (config) {
            this[config.type](config.msg);
        }
    }

    command.on({type: 'click', msg: 'onClick'}); // click and do something onClick
    command.on({type: 'blur', msg: 'onBlur'}); // blur and do something onBlur

宏命令

宏命令是一组命令的集合，通过执行宏命令的方式，可以依次执行一批命令

    // 创建子命令
    var closeDoorCommand = {
        execute: funciton () {
            console.log('关门');
        }
    }

    var openPcCommand = {
        execute: funciton () {
            console.log('开电脑');
        }
    }

    var openQQCommand = {
        execute: funciton () {
            console.log('登录QQ');
        }
    }

    // 创建宏命令
    var MacroCommand = funciton () {
        return {
            commandsList: [],
            add: function (command) {
                this.commandsList.push(command);
            },
            execute: function () {
                for (var i = 0, command; command = this.commandsList[i++];) {
                    command.execute();
                }
            }
        }
    }

    // 执行
    var macroCommand = MacroCommand();
    macroCommand.add(closeDoorCommand);
    macroCommand.add(openPcCommand);
    macroCommand.add(openQQCommand);

    macroCommand.execute();

文章列表

1. javascript设计模式 – 设计原则
2. JavaScript设计模式–高阶函数
3. Javascript 设计模式 - 01 - 原型模式
4. Javascript 设计模式 - 02 - 单例模式
5. Javascript 设计模式 - 03 - 建造者模式
6. Javascript 设计模式 - 04 - 工厂模式
7. Javascript 设计模式 - 05 - 外观模式
8. Javascript 设计模式 - 06 - 代理模式
9. Javascript 设计模式 - 07 - 观察者模式（发布订阅模式）
10. Javascript 设计模式 - 08 - 策略模式
11. Javascript 设计模式 - 09 - 命令模式
12. Javascript 设计模式 - 10 - 迭代器模式
13. Javascript 设计模式 - 11 - 职责链模式
14. Javascript 设计模式 - 12 - 适配器模式
15. Javascript 设计模式 - 13 - 模板方法
16. Javascript 设计模式 - 14 - 组合模式
17. Javascript 设计模式 - 15 - 享元模式
18. Javascript 设计模式 - 16 - 中介者模式
19. Javascript 设计模式 - 17 - 装饰者模式
20. Javascript 设计模式 - 18 - 状态模式