| FazBrowse GitHub Viewer | Trending | | Home |
| Tools: [Download Repo ZIP] [Original HTTPS Page] |
| Original file line number | Diff line number | Diff line change | |
|---|---|---|---|
@@ -136,9 +136,10 @@ | |||
| 136 | 136 | details += '<p><strong>Message:</strong><br>'; | |
| 137 | 137 | details += '{message}</p>'; | |
| 138 | 138 | messagePane.innerHTML = DED.util.substitute(details, resp); | |
| 139 | - } | ||
| 140 | - }; | ||
| 141 | - })(); | ||
| 139 | + }); | ||
| 140 | + } | ||
| 141 | + } | ||
| 142 | + } )(); | ||
| 142 | 143 | ||
| 143 | 144 | // Set up mail implementation. | |
| 144 | 145 | addEvent(window, 'load', function() { | |
| Original file line number | Diff line number | Diff line change | |
|---|---|---|---|
@@ -1,3 +1,4 @@ | |||
| 1 | + <h3>桥接模式</h3> | ||
| 1 | 2 | 按照GoF的定义,桥接模式的作用在于“将抽象与其实现隔离开来,以便二者独立变化”。这种模式对于Javascript中常见的事件驱动的编程大有裨益。<br /> | |
| 2 | 3 | 桥接模式最常见和实际的应用场合之一是事件监听器回调函数。 example:事件监听器,把事件处理的语句封装到回调函数中,通过接口而不是实现进行编程。<br /> | |
| 3 | 4 | 桥接模式的其他例子:<br /> | |
| Original file line number | Diff line number | Diff line change | |
|---|---|---|---|
@@ -1,5 +1,6 @@ | |||
| 1 | - 1、职责链模式<br /> | ||
| 2 | - 1.1、职责链的结构<br /> | ||
| 1 | + <h3>职责链模式</h3> | ||
| 2 | + <br /> | ||
| 3 | + 1、职责链的结构<br /> | ||
| 3 | 4 | <a href="https://github.com/wchaowu/javascript-code/blob/master/JavaScript-Design-Patterns/The-Chain-of-Responsibility-Pattern/1%20-%20PublicLibrary%20class.js"> | |
| 4 | 5 | 首先来看一个图书馆增加图书的例子 | |
| 5 | 6 | </a><br /> | |
@@ -17,39 +18,39 @@ addBook方法中的代码固化了对5个不同类的依赖。如果想增加更 | |||
| 17 | 18 | 实现代码 | |
| 18 | 19 | </a> | |
| 19 | 20 | <br /> | |
| 20 | - 1.2、传递请求<br /> | ||
| 21 | + 2、传递请求<br /> | ||
| 21 | 22 | 在链上传递请求有许多不同的方法,最常见的做法要么是使用一个专门的请求对象,要么是根本不使用参数,只依靠方法自身传递消息(第6节的例子)。本节讨论第一种方法。<br /> | |
| 22 | 23 | 在图书馆中根据分类搜索图书的例子,在GenreCatalog的findBoos()方法中进行传递请求的示例<br /> | |
| 23 | - 1.3、在现有层次中实现职责链<br /> | ||
| 24 | + 3、在现有层次中实现职责链<br /> | ||
| 24 | 25 | 在现有层次体系中实现这种模式往往更容易,在此情况下它经常与组合模式搭配使用。犹豫组合模式已经建立了一个对象层次体系,因此在此基础上添加一些用来处理(或传递)请求的方法很简单。<br /> | |
| 25 | 26 | 在组合模式结合了职责链之后,方法调用就不再总是不加分辨地往下一直传到叶对象。此时每一层都要对请求进行分析,以判断当前对象应该处理它还是应该把它往下传。组合对象实际上也会承担部分工作,而不是单纯依靠叶对象执行所有操作。这样一来就不用单独实现一些对象来作链上的环节,也不用手工设定下家对象。通过规定在某些场合下一些方法调用可以再层次体系中较高的层次上得到处理,并且组织较低层次的节点和叶节点获取这些调用,可以让组合模式变得更加健壮。<br /> | |
| 26 | 27 | 职责链模式和组合模式的结合对双方都是一种优化。由于职责链是现成的,所以设置代码的数量和用于职责链的额外对象的数目都减少了。由于在组合层次体系中某个方法可能会在高层得到处理,所以在整个树上执行该方法所需的计算量也降低了。<br /> | |
| 27 | - 1.4、事件委托<br /> | ||
| 28 | + 4、事件委托<br /> | ||
| 28 | 29 | Javascript语言使用了职责链模式来决定如何处理事件。事件被触发时要经历两个阶段:事件捕获阶段,事件沿HTML层次体系向下传播,直到到达被点击元素;事件冒泡阶段,在这个阶段事件会历经同一批元素升回到顶层祖先。绑定在经过的这些元素上的事件监听器既可以停止事件传播,也可以让其继续沿层次体系向上或向下传播。这里传递请求对象称为事件对象,它包含着与事件有关的所有信息。<br /> | |
| 29 | 30 | 事件模型本质是作为职责链实现的所以事件模型也可以遵循如下经验:最好在层次体系较高层次上处理请求,假设有一个无序列表包含着几打列表项。与其为其中的每一个li元素绑定一个click事件监听器,不如只为ul元素绑定一个这种事件监听器,这样脚本会运行的更快,内存消耗得更少,而且以后维护起来也更容易,这种技术称为时间委托,这是职责链方面的知识有助于优化代码的情况之一。<br /> | |
| 30 | - 1.5、职责链模式的适用场合<br /> | ||
| 31 | + 5、职责链模式的适用场合<br /> | ||
| 31 | 32 | 如果事先不知道在几个对象中有哪些能够处理请求,那么这就属于应该适用职责链的情况;<br /> | |
| 32 | 33 | 如果这批处理器对象在开发期间不可知,而是需要动态指定的话,那么也应该使用这种模式;<br /> | |
| 33 | 34 | 该模式还可以用在对于每个请求都不止有一个对象可以对它进行处理这种情况下。<br /> | |
| 34 | 35 | 使用这种模式,可以把特定的具体类与客户端隔离开,并代之以一条由弱耦合的对象组成的链,它将隐式地对请求进行处理,这有助于提高代码的模块程度和可维护性。<br /> | |
| 35 | - 1.6、图片库的进一步讨论<br /> | ||
| 36 | + 6、图片库的进一步讨论<br /> | ||
| 36 | 37 | 组合模式实现的 | |
| 37 | 38 | <a href="https://github.com/wchaowu/javascript-code/blob/master/JavaScript-Design-Patterns/The-Chain-of-Responsibility-Pattern/6%20-%20DynamicGallery%20class%20from%20Chapter%209.js"> | |
| 38 | 39 | 图片库代码 | |
| 39 | 40 | </a> | |
| 40 | 41 | <br /> | |
| 41 | 42 | <a href="https://github.com/arthinking/Javascript/blob/master/Pro-JavaScript-Design-Patterns/Chapter17-The-Chain-of-Responsibility-Pattern/17.07%20-%20DynamicGallery%20class%20with%20optimization.js"> | |
| 42 | - 1.6.1、用职责链提高组合对象的效率 | ||
| 43 | + 6.1、用职责链提高组合对象的效率 | ||
| 43 | 44 | </a> | |
| 44 | 45 | <br /> | |
| 45 | 46 | 在组合对象中,hide和show方法先对本层次的一个样式属性进行设置,然后将调用传递给所有子对象。这种做法慎密但效率不高,更好的做法是将这些方法作为沿职责链传递的请求实现,hide请求根本不用传递,show则总是需要传递。<br /> | |
| 46 | 47 | 优化一:从hide方法中删除将方法调用传递给子节点的那部分代码<br /> | |
| 47 | - 1.6.2、为图片添加标签<br /> | ||
| 48 | + 6.2、为图片添加标签<br /> | ||
| 48 | 49 | 添加标签,提供搜索功能。<br /> | |
| 49 | 50 | 通过职责链模式在组合对象中查找包含某个标签的所有对象,分别在组合对象和也对象中添加getPhotosWithTag()方法<br /> | |
| 50 | - 1.7、职责链模式之利<br /> | ||
| 51 | + 7、职责链模式之利<br /> | ||
| 51 | 52 | 可以动态选择由哪个对象处理请求。可以比试图在开发期间静态指定处理请求的对象高效得多。可以使用这种模式消除发出请求的对象与处理请求的对象之间的耦合。<br /> | |
| 52 | 53 | 在已有现成的链或层次体系的情况下,职责链模式更加有效。与组合模式的结合使用就属于这种情况。<br /> | |
| 53 | - 1.8、职责链模式之弊<br /> | ||
| 54 | + 8、职责链模式之弊<br /> | ||
| 54 | 55 | 请求与具体的处理程序被隔离开啦,因此无法保证它一定会被处理,而不是径直从链尾离开。这种模式的接收者都是隐式的,因此无法得知如果请求能够得到处理的话具体将由哪个对象处理它。可以通过创建一个通用的catch-all接收者并将其添加到所有链的尾端来解决,但这个办法很繁琐,失去随时在链尾添加新环节的灵活性。<br /> | |
| 55 | 56 | 职责链与组合对象类的搭配使用可能有点令人困惑。组合模式期望组合对象节点完全可以与叶节点互换使用,而且客户代码看不出其中的差别,所有方法调用都被组合对象往层次体系的下层传递。而职责链模式引入后,有些方法会在组合对象进行处理,而不会进行往下传。 | |
| Original file line number | Diff line number | Diff line change | |
|---|---|---|---|
@@ -1,4 +1,5 @@ | |||
| 1 | - 单例模式是Javascript中最常用的模式之一<br/> | ||
| 1 | + <h3>单例模式</h3> | ||
| 2 | + <br/> | ||
| 2 | 3 | 应用场景 <br/> | |
| 3 | 4 | 使用单例模式可以用来创建命名空间以减少全局变量的数目,而全局变量也很容易被改写,不安全。描述性的命名空间也可以增强代码的说明性,便于理解;<br/> | |
| 4 | 5 | 把相关方法和属性组织到一个不会被多次实例化的单例中,更好的维护和调试代码;<br/> | |
| Back | FazBrowse Home | New Git URL |
0 commit comments