* 基本宏命令

var closeDoorCommand = {

	execute: function() {

		console.log("Closing the door...");

	}

};

var openPcCommand = {

	execute: function() {

		console.log("Opening the PC...");

	}

};

var launchQQCommand = {

	execute: function() {

		console.log("launching QQ...");

	}

};

var MacroCommand = function() {

	return {

		commandsList: [],

		add: function(command) {

			this.commandsList.push(command);

		},

		execute: function() {

			for (var i = 0, command; command = this.commandsList[i]; i++) {

				command.execute();

			}

		}

	}

};

var macroCommand = MacroCommand();

macroCommand.add(closeDoorCommand);

macroCommand.add(openPcCommand);

macroCommand.add(launchQQCommand);

macroCommand.execute();

// Closing the door...

// Opening the PC...

// launching QQ...

　　

* 树形宏命令

<html>

<head>

    <meta charset="UTF-8">

    <title>macro command</title>

</head>

<body>

    <button id="button">Press me</button>

    <script>

    var MacroCommand = function() {

        return {

            commandsList: [],

            add: function(command) {

                this.commandsList.push(command);

            },

            execute: function() {

                for (var i = 0, command; command = this.commandsList[i]; i++) {

                    command.execute();

                }

            }

        }

    };

    // 打开空调

    var openAcCommand = {

        execute: function() {

            console.log("Opening the Air conditioner...");

        }

    };

    // 打开电视和音响

    var openTvCommand = {

        execute: function() {

            console.log("Opening the TV...");

        },

        add: function() {

        	throw new Error('Cannot add child node to leaf object');

        }

    };

    var openStereoCommand = {

        execute: function() {

            console.log("Opening the stereo...");

        }

    };

    var macroCommand1 = MacroCommand();

    macroCommand1.add(openTvCommand);

    macroCommand1.add(openStereoCommand);

    // 关门、开电脑、登陆qq

    var closeDoorCommand = {

        execute: function() {

            console.log("Closing the door...");

        }

    };

    var openPcCommand = {

        execute: function() {

            console.log("Opening the PC...");

        }

    };

    var launchQQCommand = {

        execute: function() {

            console.log("launching QQ...");

        }

    };

    var macroCommand2 = MacroCommand();

    macroCommand2.add(closeDoorCommand);

    macroCommand2.add(openPcCommand);

    macroCommand2.add(launchQQCommand);

    // 现在把所有的命令组合成一个超级命令

    var macroCommand = MacroCommand();

    macroCommand.add(openAcCommand);

    macroCommand.add(macroCommand1);

    macroCommand.add(macroCommand2);

    // 绑定到遥控器

    var setCommand = (function(command) {

        document.getElementById("button").onclick = function() {

            command.execute();

        }

    })(macroCommand);

    // openTvCommand.add(macroCommand);  // Uncaught Error:

    </script>

</body>

</html>

　　

　　

运行结果:

* 扫描文件夹

/********** Folder **************/

function Folder(name) {

    this.name = name;

    this.files = [];

}

Folder.prototype.add = function(file) {

    this.files.push(file);

}

Folder.prototype.scan = function() {

    console.log("开始扫描文件夹: " +this.name);

    for (var i = 0, file, files = this.files; file = files[i]; i++) {

        file.scan();

    }

}

/********** File **************/

function File(name) {

    this.name = name;

}

File.prototype.add = function() {

    throw new Error("文件下面不能再添加文件");

}

File.prototype.scan = function() {

    console.log("开始扫描文件: " +this.name);

}

var folder = new Folder('学习资料');

var folder1 = new Folder('javascript');

var folder2 = new Folder('jQuery');

var file1 = new File('javascript设计模式与开发实践');

var file2 = new File('精通jQuery');

var file3 = new File('重构与模式');

folder1.add(file1);

folder2.add(file2);

folder.add(folder1);

folder.add(folder2);

folder.add(file3);

var folder3 = new Folder('Nodejs');

var file4 = new File('深入浅出Node.js');

folder3.add(file4);

var file5 = new File('javascript语言精髓与编程实践');

folder.add(folder3);

folder.add(file5);

folder.scan();

/*

开始扫描文件夹: 学习资料

开始扫描文件夹: javascript

开始扫描文件: javascript设计模式与开发实践

开始扫描文件夹: jQuery

开始扫描文件: 精通jQuery

开始扫描文件: 重构与模式

开始扫描文件夹: Nodejs

开始扫描文件: 深入浅出Node.js

开始扫描文件: javascript语言精髓与编程实践

*/

　　

* 引用父对象

/********** Folder **************/

function Folder(name) {

    this.name = name;

    this.parent = null;  // add attribute this.parent

    this.files = [];

}

Folder.prototype.add = function(file) {

    file.parent = this;  // set parent object

    this.files.push(file);

}

Folder.prototype.scan = function() {

    console.log("开始扫描文件夹: " +this.name);

    for (var i = 0, file, files = this.files; file = files[i]; i++) {

        file.scan();

    }

}

Folder.prototype.remove = function() {

    if (!this.parent) { // root node or free node

        return;

    }

    for (var files = this.parent.files, i = files.length -1; 0 <= i; i--) {

        var file = files[i];

        if (file === this) {

            files.splice(i, 1);

        }

    }

}

/********** File **************/

function File(name) {

    this.name = name;

}

File.prototype.add = function() {

    throw new Error("文件下面不能再添加文件");

}

File.prototype.scan = function() {

    console.log("开始扫描文件: " +this.name);

}

File.prototype.remove = function() {

    if (!this.parent) { // root node or free node

        return;

    }

    for (var files = this.parent.files, i = files.length -1; 0 <= i; i--) {

        var file = files[i];

        if (file === this) {

            files.splice(i, 1);

        }

    }

}

var folder = new Folder('学习资料');

var folder1 = new Folder('javascript');

var file1 = new File('深入浅出Node.js');

folder1.add(new File('javascript语言精髓与编程实践'));

folder.add(folder1);

folder.add(file1);

folder1.remove();

folder.scan();

　　

　　

js 命令模式 组合模式的更多相关文章

  1. JS设计模式——9.组合模式

    组合模式概述 组合模式是一种专为创建Web上的动态用户界面量身定制的模式.使用这种模式可以用一条命令在多个对象上激发复杂的递归的行为. 它可以用来把一批子对象组织成树形结构,并且使整棵树都可被遍历.所 ...

  2. js中的组合模式

    <!doctype html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  3. Head First 设计模式 --9 迭代器模式 组合模式

    迭代器模式:提供一种方法书序访问一个聚合对象中的各个元素,而又不暴露其内部的表示. 用到的设计原则:1.封装变化2.多用组合,少用继承|3.针对接口编程,不针对实现编程4.松耦合5.对扩展开放,对修改 ...

  4. java设计模式--结构型模式--组合模式

    什么是组合模式,这个有待研究,个人觉得是各类组合而形成的一种结构吧. 组合模式: 组合模式 概述 将对象组合成树形结构以表示"部分-整体"的层次结构."Composite ...

  5. 《Head First 设计模式》学习笔记——迭代模式 + 组合模式

    迭代模式设置共生死亡,一般来说.我们只是想实现一个集,我们需要的同时提供这个集合的迭代器,喜欢java中间Collection.List.Set.Map等,这些集合都有自己的迭代器.假如我们要实现一个 ...

  6. Composite模式 组合模式

    Android的ViewGroup 和 View 的关系,即是采用组合模式 1. 概述 在数据结构里面,树结构是很重要,我们可以把树的结构应用到设计模式里面. 例子1:就是多级树形菜单. 例子2:文件 ...

  7. 轻松掌握：JavaScript组合模式

    组合模式 组合模式:将一组对象组合成树形结构,并统一对待组合对象和叶对象,忽略它们之间的不同(因为叶对象也可以也可以包含叶对象而成为组合对象),组合模式中的对象只能是一对多的关系,不能出现多对一. 基 ...

  8. js---26组合模式

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/stri ...

  9. c#设计模式-组合模式

    在软件开发过程中,我们经常会遇到处理简单对象和复合对象的情况,例如对操作系统中目录的处理就是这样的一个例子,因为目录可以包括单独的文件,也可以包括文件夹,文件夹又是由文件组成的,由于简单对象和复合对象 ...

随机推荐

  1. MySQL自定义函数与存储过程的创建、使用、删除

    前言 日常开发中,可能会用到数据库的自定义函数/存储过程,本文记录MySQL对自定义函数与存储过程的创建.使用.删除的使用 通用语法 事实上,可以认为存储过程就是没有返回值的函数,创建/使用/删除都非 ...

  2. SQL 练习41

    编写一个 SQL 查询,获取 Employee 表中第二高的薪水(Salary) 例如上述 Employee 表,SQL查询应该返回 200 作为第二高的薪水.如果不存在第二高的薪水,那么查询应返回 ...

  3. Mac 证书错误

    在 Mac 操作系统安装 Python 3.6 或以上版本时,可能会遇到证书错误:Error: [SSL: CERTIFICATE_VERIFY_FAILED] certificate verify ...

  4. Anaconda Pycharm 是怎么个事儿？

    前言 许多人学习Python的经历可能很相似,写程序没有问题,最后却被各种环境困扰. 不论你是Python小白,还是学习Python有一段时间了.都可以认真的看一下ヾ(≧▽≦*)o 这篇文章让你对An ...

  5. 【spring 注解驱动开发】spring ioc 原理

    尚学堂spring 注解驱动开发学习笔记之 - Spring容器创建 Spring容器创建 1.Spring容器创建-BeanFactory预准备 2.Spring容器创建-执行BeanFactory ...

  6. hive -- 外部表、内部表、临时表

    1.外部表 关键字:EXTERNAL 外部表创建时需要指定LOCATION 删除外部表时,数据不被删除 CREATE EXTERNAL TABLE page_view(viewTime INT, us ...

  7. IPython中也要保持优雅（DRY原则）

    What is IPython? IPython provides a rich architecture for interactive computing with: A powerful int ...

  8. MAC下Jetbrains编译器无法打开问题解决

    这段时间不知道怎么回事,每次打开Rider必定闪退,毫无头绪,只好暂时放弃使用Rider,试用了一段时间Visual Studio. 可惜...虽然大学时候觉得VS天下第一,但是用惯了JB的编译器,再 ...

  9. linux shell 脚本输入参数解析

    文件名: test.sh #!/bin/bash para="para: "; while [ $# -ge 2 ] ; do case "$1" in --a ...

  10. ks.cfg文件相关

    原文转自:https://www.cnblogs.com/itzgr/p/10029631.html作者:木二 目录 一 图形化生成ks.cfg文件 二 ks.cfg文件相关项解析 一 图形化生成ks ...