* 基本宏命令

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. Linux系统启动初始化

    文章目录 一.BIOS 加载启动引导程序 二.MBR 主引导扇区 三.GRUB引导内核 3.1运行 boot.img 3.2加载 core.img 3.3切换到保护模式 3.4kernel.img 引 ...

  2. 题解 Walker

    传送门 总觉得有个柿子可以推--然而没推出来 考试的时候有个柿子假了导致我没想用两个点可以解出一组参数的事 假掉的柿子告诉我有不少东西能消掉 然而实际上随便选两个点高斯消元解出一组参数,再代入验证看够 ...

  3. SpringBoot整合SpringBatch

    一.引入依赖 pom.xml <?xml version="1.0" encoding="UTF-8"?> <project xmlns=&q ...

  4. springboot中@Mapper和@Repository的区别

    @Mapper和@Repository是常用的两个注解,两者都是用在dao上,两者功能差不多,容易混淆,有必要清楚其细微区别: 区别: @Repository需要在Spring中配置扫描地址,然后生成 ...

  5. C++类的构造函数后面加一个冒号的含义

    最近在看侯捷老师讲解的C++知识,他讲到在构造函数加一个冒号初始化值的方法,会使代码更大气,在此记录一下使用方法 构造函数冒号后的初始化class complex{public: complex(do ...

  6. C#根据输入的字符串来创建类的实例

    abstract class Vehicle { public abstract void Drive(); } class Car : Vehicle { public override void ...

  7. Javascript - Vue - 路由

    vue router.js 下载:vue-router.js, 该文件依赖于vue.js <script src="Scripts/vue-2.4.0.js">< ...

  8. LeetCode入门指南 之 二叉树

    二叉树的遍历 递归: void traverse (TreeNode root) { if (root == null) { return null; } //前序遍历位置 traverse(root ...

  9. java《设计原则-里氏替换原则》

    package dubbo.wangbiao.project.ThreadAndSocket.designprinciples.lishitihuanyuanze.k0; //长方形 public c ...

  10. easycode一键生成