Javascript乱弹设计模式系列(5) － 命令模式(Command)

核心提示： 帮助（子菜单：关于作者） 编辑器的这些功能实际上很常用，最后点击“得到HTML值”的按钮，Javascript乱弹设计模式系列(5) － 命令模式(Command)(2)，可以得到HTML的内容，这里就可以按照您的需要来存储编辑器内容；文章的最后我将附上源代码，比如

帮助（子菜单：关于作者）

编辑器的这些功能实际上很常用。最后点击“得到HTML值”的按钮，可以得到HTML的内容，这里就可以按照您的需要来存储编辑器内容；文章的最后我将附上源代码。

1. 首先添加一个ICommand.js文件，其中定义一个Command接口：

varICommand=newInterface("ICommand",[["execute"]]);

其中execute作为Command执行的接口方法;

关于接口的定义，可以参考我的第0篇－面向对象基础以及接口和继承类的实现的实现。

2. 添加一个ConcreteCommand.js文件，作为继承ICommand接口的所有具体实现类：

因为子菜单中的每个按钮都可作为一个具体实现类，那么我以“加粗”按钮为例，就可以得到：

//加粗
functiononBoldCommand(){
　　Interface.registerImplements(this,ICommand);
}
onBoldCommand.prototype.execute=function(){
　　vareditor=window.frames["HtmlEditor"];
　　editor.document.execCommand("Bold",false,false);
　　editor.focus();
};

其中Interface.registerImplements(this, ICommand);说明它继承于ICommand接口，而execute方法作为基于接口方法的具体实现，这里实现了文档加粗功能；

3. 现在要创建“主菜单”和“子菜单”，Menu类和MenuItem类，注意这里“子菜单”也可能是Menu类，比如“格式”主菜单下的“位置”下面还包括下级菜单“居左对齐”，“居中对齐”，“居右对齐”等等，所以作为“叶子”结点的菜单就以MenuItem类来实现：