
设计模式
文章平均质量分 92
JS主要设计模式
、妤
这个作者很懒,什么都没留下…
展开
-
JavaScript设计模式———抽象工厂模式
定义:抽象工厂模式:通过对类的工厂抽象,使其对象用于对产品类簇的创建,而不负责创建某一类产品的实例。抽象工厂模式是指当有多个抽象角色时,使用的一种工厂模式。抽象工厂模式可以向客户端提供一个接口,使客户端在不必指定产品的具体的情况下,创建多个产品族中的产品对象。简单工厂模式和工厂模式都是直接生产实例的,抽象工厂更像是生产工厂,其实抽象工厂其实是实现子类继承父类的方法。说白了 抽象工厂模式 我认为就是工厂功能模式的扩充版,简单工厂生产实例 ,工厂功能模式生产实例的接口,抽象工厂生产的是工厂比如说原创 2020-05-08 19:03:38 · 692 阅读 · 0 评论 -
JavaScript设计模式———总结
设计模式总结设计原则和编程技巧单一职责原则(SRP)定义设计模式中体现何时应该分离职责SRP 原则的优缺点最少知识原则(LKP)- 迪米特法则定义设计模式中体现封装在最少知识原则中的体现开放-封闭原则定义最佳实践(帮助我们编写遵守开放-封闭原则的代码)设计模式中体现接受第一次愚弄开放- 封闭原则的相对性接口和面向接口编程设计模式概述和比较设计原则和编程技巧每种设计模式都是为了让代码迎合其中一个...原创 2020-05-06 23:59:23 · 527 阅读 · 0 评论 -
JavaScript设计模式———备忘录模式
定义备忘录模式,在不破坏对象封装性的前提下,在对象之外捕获并保存该对象的内部状态,以便日后在该对象使用时恢复到之前的某个状态。问题引入// 事件:下一页$('#next_page_btn').click(function() { // 获取新闻列表容器 var $news = $('#news_content'); // 获取当前页号 var page = $news.data('page'); // 从服务端获取下一页的列表数据并显示 getPage原创 2020-05-12 00:53:41 · 531 阅读 · 0 评论 -
JavaScript设计模式———访问者模式
定义访问者模式,针对于对象结构中的元素,定义在不改变该对象的前提下访问其结构中元素的新方法。// 访问者模式:DOM事件绑定var bindEvent = function(dom, type, fn, data) { if (dom.addEventListener) { dom.addEventListener(type, fn, false); } else if (dom.attachEvent) { // dom.attachEvent('on原创 2020-05-12 00:49:35 · 514 阅读 · 0 评论 -
JavaScript设计模式———桥接模式
定义桥接模式(Bridge),将抽象部分与它的实现部分分离,使他们可以独立的变化。意图:将抽象与实现解耦。对于前端,比较常用的场景,是事件监控:addEvent(element, 'click', getDrinkById);function getDrinkById(e) { var id = this.id; asyncRequest('GET', 'drink.uri?id=' + id, function(resp) { // callback respo原创 2020-05-11 23:41:51 · 289 阅读 · 0 评论 -
JavaScript设计模式———建造者模式
定义:建造者模式,将一个复杂对象的构建层与其表示层相互分离,同样的构建过程可采用不同的表示。对比 建造者模式和工厂模式工厂模式(或抽象工厂)主要是为了创建对象实例或者类簇,该模式关心的是最终产出,即创建的结果是什么;该模式并不关心对象创建的整个过程,仅仅需要知道最终的创建结果即可。建造者模式的目标任务也是创建对象,但该模式更多关心的是对象创建的整个过程,甚至关心到对象创建的每一个细节。比如用建造者模式创建一个“Person”的对象时,它不仅要得到Person的对象,还要深入到对象创建的过程中去,人应原创 2020-05-08 19:30:41 · 195 阅读 · 0 评论 -
JavaScript设计模式———工厂方法模式
定义工厂方法模式:即通过对产品类的抽象使其创建业务主要负责用于创建多类产品的实例。安全模式类:即使不使用new关键字,也能正确创建出该类的实例的类。安全模式类,既可以使用new关键字来创建对象,也可以不使用new关键字来创建对象。instanceof 运算符用来测试一个对象在其原型链中是否存在一个构造函数的 prototype 属性。语法:object instanceof cons...原创 2020-05-08 15:23:36 · 502 阅读 · 0 评论 -
JavaScript设计模式———简单工厂模式
简单工厂模式(Simple Factory),又叫静态工厂方法,由一个工厂对象来决定创建某一种产品对象类的实例,主要用来创建同一类对象。在用 Java 等静态类型语言编写程序的时候,类型之间的解耦非常重要。依赖倒置原则提醒我们创建对象的时候要避免依赖具体类型,而用 new XXX 创建对象的方式显得很僵硬。工厂方法模式和抽象工厂模式可以帮助我们解决这个问题,但这两个模式会带来许多跟产品类平行的工...原创 2020-05-08 14:22:27 · 398 阅读 · 0 评论 -
JavaScript设计模式———适配器模式
适配器模式的作用是解决两个软件实体间的接口不兼容的问题。使用适配器模式之后,原本由于接口不兼容而不能工作的两个软件实体可以一起工作。适配者模式: 主要用于解决两个接口之间不匹配的问题。例子:我们向 googleMap 和 baiduMap 都发出“显示”请求时, googleMap和 baiduMap 分别以各自的方式在页面中展现了地图var googleMap = {show: fun...原创 2020-05-05 11:13:04 · 277 阅读 · 0 评论 -
JavaScript设计模式———状态模式
状态模式的关键是区分事物内部的状态,事物内部状态的改变往往会带来事物的行为改变。状态模式: 将事物内部的每个状态分别封装成类, 内部状态改变会产生不同行为。通常我们谈到封装,一般都会优先封装对象的行为,而不是对象的状态。但在状态模式中刚好相反,状态模式的关键是把事物的每种状态都封装成单独的类,跟此种状态有关的行为都被封装在这个类的内部,只需要在上下文中,把这个请求委托给当前的状态对象即可,该状...原创 2020-05-05 10:51:54 · 366 阅读 · 0 评论 -
JavaScript设计模式———装饰者模式
装饰者模式(使用装饰函数装饰对象)可以动态地给某个对象添加一些额外的职责,而不会影响从这个类中派生的其他对象在 JavaScript 中,几乎一切都是对象,其中函数又被称为一等对象。在平时的开发工作中,也许大部分时间都在和函数打交道。在 JavaScript 中可以很方便地给某个对象扩展属性和方法,但却很难在不改动某个函数源代码的情况下,给该函数添加一些额外的功能。在代码的运行期间,我们很难切入...原创 2020-05-04 00:00:35 · 161 阅读 · 0 评论 -
JavaScript设计模式———中介者模式
中介者模式: 对象和对象之间借助第三方中介者进行通信。中介者模式的作用就是解除对象与对象之间的紧耦合关系。增加一个中介者对象后,所有的相关对象都通过中介者对象来通信,而不是互相引用,所以当一个对象发生改变时,只需要通知中介者对象即可。中介者使各对象之间耦合松散,而且可以独立地改变它们之间的交互。中介者模式使网状的多对多关系变成了相对简单的一对多关系。例子:假设我们正在编写一个手机购买的页面...原创 2020-05-03 22:09:39 · 281 阅读 · 0 评论 -
JavaScript设计模式———职责链模式
职责链模式的定义是:使多个对象都有机会处理请求,从而避免请求的发送者和接收者之间的耦合关系,将这些对象连成一条链,并沿着这条链传递该请求,直到有一个对象处理它为止。职责链模式的名字非常形象,一系列可能会处理请求的对象被连接成一条链,请求在这些对象之间依次传递,直到遇到一个可以处理它的对象,我们把这些对象称为链中的节点,如图所示。例子:场景: 某电商针对已付过定金的用户有优惠政策, 在正式...原创 2020-05-03 17:05:10 · 253 阅读 · 0 评论 -
JavaScript设计模式———享元模式
享元模式是一种优化程序性能的模式, 本质为减少对象创建的个数。享元模式的核心是运用共享技术来有效支持大量细粒度的对象。如果系统中因为创建了大量类似的对象而导致内存占用过高,享元模式就非常有用了。例子:某商家有 50 种男款内衣和 50 种款女款内衣, 要展示它们传统方式: 造 50 个塑料男模和 50 个塑料女模, 让他们穿上展示, 代码如下:const Model = functio...原创 2020-05-02 23:49:22 · 176 阅读 · 0 评论 -
JavaScript设计模式———模板方法模式
定义: 在继承的基础上, 在父类中定义好执行的算法。模板方法模式由两部分结构组成,第一部分是抽象父类,第二部分是具体的实现子类。通常在抽象父类中封装了子类的算法框架,包括实现一些公共方法以及封装子类中所有方法的执行顺序****。子类通过继承这个抽象类,也继承了整个算法结构,并且可以选择重写父类的方法。例子:泡茶和泡咖啡来对比下泡茶和泡咖啡过程中的异同步骤 泡茶 泡咖啡1 烧...原创 2020-05-02 21:18:52 · 214 阅读 · 0 评论 -
JavaScript设计模式———组合模式
在这里插入代码片原创 2020-05-02 14:00:46 · 246 阅读 · 0 评论 -
JavaScript设计模式———命令模式
命令模式基于面向对象的命令模式JavaScript 中的命令模式智能命令与傻瓜命令命令模式最常见的应用场景是:有时候需要向某些对象发送请求,但是并不知道请求的接收者是谁,也不知道被请求的操作是什么。此时希望用一种松耦合的方式来设计程序,使得请求发送者和请求接收者能够消除彼此之间的耦合关系。命令模式会把请求封装为一个 command 对象,利用 command 对象去调用实际接收者,从而达到发送...原创 2020-05-01 23:17:20 · 162 阅读 · 0 评论 -
JavaScript设计模式———订阅-发布者模式
这里写自定义目录标题必须先订阅再发布吗总结发布—订阅模式又叫观察者模式,它定义对象间的一种一对多的依赖关系,当一个对象的状态发生改变时,所有依赖于它的对象都将得到通知。在 JavaScript 开发中,我们一般用事件模型来替代传统的发布—订阅模式。实现一个发布订阅模式var Event = function() { this.obj = {}}Event.prototype.on ...原创 2020-05-01 00:58:33 · 194 阅读 · 0 评论 -
JavaScript设计模式———迭代器模式
迭代器模式迭代器分类内部迭代器外部迭代器总结迭代器模式是指提供一种方法顺序访问一个聚合对象中的各个元素,而又不需要暴露该对象的内部表示。迭代器模式可以把迭代的过程从业务逻辑中分离出来,在使用迭代器模式之后,即使不关心对象的内部构造,也可以按顺序访问其中的每个元素。迭代器分类内部迭代器内部迭代器在调用的时候非常方便,外界不用关心迭代器内部的实现,但这也刚好是内部迭代器的缺点。比如要比较两数...原创 2020-04-30 03:17:39 · 120 阅读 · 0 评论 -
JavaScript设计模式———代理模式
代理模式一级目录二级目录三级目录代理的意义代理的分类虚拟代理缓存代理代理模式的特点总结一级目录二级目录三级目录代理模式是为一个对象提供一个代用品或占位符,以便控制对它的访问。代理的意义为了说明代理的意义,下面我们引入一个面向对象设计的原则——单一职责原则。单一职责原则指的是,就一个类(通常也包括对象和函数等)而言,应该仅有一个引起它变化的原因。如果一个对象承担了多项职责,就意味着这个...原创 2020-04-30 02:54:03 · 148 阅读 · 0 评论 -
JavaScript设计模式———策略模式
策略模式策略模式的定义是: 定义一系列的算法,把它们一个个封装起来,并且使它们可以相互替换。例子:计算奖金:根据绩效不同,年终奖金计算不同将不变的部分和变化的部分隔开是每个设计模式的主题,策略模式也不例外,策略模式的目的就是将算法的使用与算法的实现分离开来。一个基于策略模式的程序至少由两部分组成。第一个部分是一组策略类,策略类封装了具体的算法,并负责具体的计算过程。 第二个部分是环境类 ...原创 2020-04-30 00:11:36 · 142 阅读 · 0 评论 -
JavaScript设计模式———单例模式
单例模式不透明单例模式透明单例模式代理实现单例模式关于JS中的单例模式的说明使用命名空间使用闭包封装私有变量惰性单例单例模式的定义是: 保证一个类仅有一个实例,并提供一个访问它的全局访问点。单例模式的核心是确保只有一个实例,并提供全局访问不透明单例模式例子:function SingleInstance(name) { this.name = name this.inst...原创 2020-04-27 01:19:41 · 296 阅读 · 0 评论 -
JavaScript——面向对象设计部分总结
关于面向对象设计的相关总结多态类型检查和多态静态类型语言的多态JavaScript的多态封装封装数据封装实现封装类型封装变化多态同一操作作用于不同的对象上面,可以产生不同的解释和不同的执行结果。换句话说,给不同的对象发送同一个消息的时候,这些对象会根据这个消息分别给出不同的反馈。案例:向不同动物发出‘叫声’的命令var makeSound = function(animal) { ...原创 2020-04-22 00:44:51 · 174 阅读 · 0 评论