命令模式 概念描述 命令模式(Command): 将请求与实现解耦并封装成独立的对象,从而使不同的请求对客户端的实现参数化 示例代码 命令模式我们可以看成是将创建模块的逻辑封装在一个对象里,这个对象提供一个参数化的请求接口,通过调用这个接口并传递一些参数实现调用命令对象内部中的一些方法. 对于命令模式来说,请求部分很简单,只需要按照给定的参数格式书写指令即可,所以实现部分封装才是重点,因为它要为请求部分提供所需方法. 下面我们来看一个具体的例子,我们通过命令模式来封装一个画布对象并实现调用命令对…

我的学习笔记是根据我的学习情况来定期更新的,预计2-3天更新一章,主要是给大家分享一下,我所学到的知识,如果有什么错误请在评论中指点出来,我一定虚心接受,那么废话不多说开始我们今天的学习分享吧! 前几次,我们分享的都是工厂模式,工厂模式主要是为了创建对象实例或者类簇,关心的是最终创建的是什么,而不关心创建的过程,本次我们来分享创建对象的另一种模式,建造者模式,这种模式在创建独享的时候,要更复杂一些,虽然其目的也是为了创建对象,但是更多的是关心创建这个对象的过程. 建造者模式 建造者模式(Buil…

我的学习笔记是根据我的学习情况来定期更新的,预计2-3天更新一章,主要是给大家分享一下,我所学到的知识,如果有什么错误请在评论中指点出来,我一定虚心接受,那么废话不多说开始我们今天的学习分享吧! 我们之前分享过在JavaScript中继承是靠原型链来实现的,那么设计模式中就一定有原型模式,所以本次我们分享的就是原型模式 原型模式 原型模式(Prototype): 用原型实例指向创建对象的类,使用创建新的对象的类共享原型对象的属性以及方法. 假如我们有一个需求需要做图片轮播效果,但是,在这个页面又…

经过一段时间的学习与分享,我们对创建型设计模式已经有了一定的认识,未来的一段时间里我们将展开新的篇章,开始迈入结构性设计模式的学习. 结构性设计模式与创建型设计模式不同,结构性设计模式更偏向于关注如何将类和对象组合成更大.更复杂的结构,以简化设计. 外观模式 外观模式(Facede): 为一组复杂的子系统接口提供一个更高级的统一接口,通过这个接口使得对子系统接口的访问更容易.在JavaScript中有时也会用于对底层结构兼容性做统一的封装来简化用户使用. 这个含义看上去有点抽象,下面我将通过示例…

桥接模式 桥接模式(Bridge): 在系统沿着多个维度变化的同时,又不增加其复杂度并已达到解耦 从定义上看桥接模式的定义十分难以理解,那么我们来通过示例来演示什么是桥接模式. 现在我们需要做一个导航栏随鼠标移入移出改变颜色的简单特效,但是部分选项卡全部变色,部分选项卡部分变色 html代码如下: <div style="width: 400px;height: 40px;"> <span style="width: 120px;height: 40px;d…

模板方法模式 由模板方法模式开始我们正式告别结构型设计模式,开始行为型设计模式的学习分享 行为型设计模式用于不同对象之间职责划分或算法抽象,行为型设计模式不仅仅涉及类和对象,还涉及类或对象之间的交流模式并加以实现 模板方法模式(Template Method): 父类中定义一组操作算法骨架,而将一些实现步骤延迟到子类中,使得子类可以不改变父类的算法结构的同时可重新定义算法中某些实现步骤. 总的来说模板方法模式就是将多个模型抽象化归一,从中抽象提取出来一个最基本的模板,然后其他模块只需要继承这个模…

策略模式 策略模式(Strategy):将定义的一组算法封装起来,使其相互之间可以替换.封装的算法具有一定的独立性,不会随客户端变化而变化. 其实策略模式在我们生活中可应用的地方还是比较多的,比如在商城搞促销的时候,会有很多打折的情况比如5折呀,7折呀,还会有各种返利,比如满200-100这类的活动,这种场景,我们的策略模式就可以应用上去 示例演示 //创建折扣策略对象 var DiscountStrategy = function() { //创建内部算法对象 var stragtegy =…

访问者模式 概念介绍 访问者模式(Visitor): 针对于对象结构中的元素,定义在不改变该对象的前提下访问结构中元素的新方法 解决低版本IE兼容性 我们来看下面这段代码,这段代码,我们封装了一个绑定事件的方法,接着我们调用这个方法,通过点击页面上的元素,改变元素的样式. var bindEvent=function(dom,type,fn){ if(dom.addEventListener){ dom.addEventListener(type,fn,false); }else if(dom.…

备忘录模式 概念介绍 备忘录模式(Memento): 在不破坏对象的封装性的前提下,在对象之外捕获并保存该对象内部的状态以便日后对象使用或者对象恢复到以前的某个状态. 简易分页 在一般情况下我们需要做分页都是前台传递页数,有的时候还需要传递每页显示行数,然后请求后台数据,后台获取数据后在传递给前台展示出来,我们一起来实现以下这个简易分页吧. 首先我们先编写后台代码,我们在ASP.NET MVC的Home控制器里增加一个Page方法,这个Page方法返回Json格式数据. public JsonR…

迭代器模式 概念介绍 迭代器模式(Iterator): 在不暴露对象内部结构的同时,可以顺序地访问聚合对象内部的元素. 迭代器 程序中的循环是一种利器,循环语句也使我们程序开发更简洁高效,但是有时一遍又一遍的重复性循环却让代码显得循环不堪. 这个时候我们就可以用迭代器来简化我们的循环遍历操作,下面我们创建一个迭代器类. //迭代器 var Iterator=function(items,container){ //获取父容器,若container参数存在,并且可以获取该元素则获取,否则获取doc…