![](https://img-blog.csdnimg.cn/20201127090723443.jpg?x-oss-process=image/resize,m_fixed,h_224,w_224)
JavaScript设计模式
文章平均质量分 96
JavaScript(简称“JS”) 是一种具有函数优先的轻量级,解释型或即时编译型的编程语言。虽然它是作为开发Web页面的脚本语言而出名,但是它也被用到了很多非浏览器环境中,JavaScript 基于原型编程、多范式的动态脚本语言,并且支持面向对象、命令式、声明式、函数式编程范式。
aiguangyuan
要全身心的投入,程序才会有些感觉!
展开
-
JavaScript 设计模式学习第二十九篇- 中间件
(Middleware),又称中介层,是提供系统软件和应用软件之间连接的软件,以便于软件各部件之间的沟通,特别是应用软件对于系统软件的集中的逻辑。中间件在企业架构中表示各种软件套件,有助于抽象底层机制,比如操作系统 API、网络通信、内存管理等,开发者只需要关注应用中的业务模块。从更广义的角度来看,中间件也可以定义为链接底层服务和应用的软件层。后文我们主要使用 Node.js 里最近很热门的框............原创 2019-12-13 16:49:02 · 935 阅读 · 0 评论 -
JavaScript 设计模式学习第二十八篇- 链模式
通常情况下,通过对构造函数使用 new会返回一个绑定到 this上的新实例,所以我们可以在 new出来的对象上直接用 . 访问其属性和方法。如果在普通函数中也返回当前实例,那么我们就可以使用 . 在单行代码中一次性连续调用多个方法,就好像它们被链接在一起一样,这就是链式调用,又称链模式。之前建造者模式、组合模式等文章已经用到了链模式,日常使用的 jQuery、Promise 等也使用了链模...............原创 2019-12-12 22:15:36 · 271 阅读 · 0 评论 -
JavaScript 设计模式学习第二十七篇- 模块模式
模块是任何健壮的应用程序体系结构不可或缺的一部分,特点是有助于保持应用项目的代码单元既能清晰地分离又有组织,下面我们来看看各种不同的模块模式解决方案。1. 模块模式1.1. 命名空间模式命名空间模式是一个简单的模拟模块的方法,即创建一个全局对象,然后将变量和方法添加到这个全局对象中,这个全局对象是作为命名空间一样的角色。var MYNS = {}MYNS.param1 = '.........原创 2019-12-12 13:51:00 · 548 阅读 · 0 评论 -
JavaScript 设计模式学习第二十六篇- MVC、MVP、MVVM 模式
在下文中,如果某些内容和你看的某本书或者某个帖子上的不一样,不要惊慌,多看几本书,多打开几个帖子,你会发现每个都不一样,所以模式具体是如何表现并不重要,重要的是,了解这三个模式主要的目的和思想是什么:1.MVC 模式:从大锅烩时代进化,引入了分层的概念,但是层与层之间耦合明显,维护起来不容易;2.MVP 模式:在 MVC 基础上进一步解耦,视图层和模型层完全隔离,交互只能通过管理层来进.........原创 2019-12-11 22:47:00 · 490 阅读 · 0 评论 -
JavaScript 设计模式学习第二十五篇-中介者模式
中介者模式(Mediator Pattern)又称调停模式,使得各对象不用显式地相互引用,将对象与对象之间紧密的耦合关系变得松散,从而可以独立地改变他们。核心是多个对象之间复杂交互的封装。根据最少知识原则,一个对象应该尽量少地了解其他对象。如果对象之间耦合性太高,改动一个对象则会影响到很多其他对象,可维护性差。复杂的系统,对象之间的耦合关系会得更加复杂,中介者模式就是为了解决这个问题而诞生的。............原创 2019-12-11 14:03:54 · 372 阅读 · 0 评论 -
JavaScript 设计模式学习第二十四篇-职责链模式
职责链模式(Chain of Responsibility Pattern)为请求创建了一个接收者对象的链。这种模式给予请求的类型,对请求的发送者和接收者进行解耦。这种类型的设计模式属于行为型模式。在这种模式中,通常每个接收者都包含对另一个接收者的引用。如果一个对象不能处理该请求,那么它会把相同的请求传给下一个接收者,依此类推。1. 曾经见过的职责链模式小伙伴来你的城市找你玩耍,因此你...............原创 2019-12-11 10:18:36 · 453 阅读 · 0 评论 -
JavaScript 设计模式学习第二十三篇-命令模式
命令模式(Command Pattern)又称事务模式,将请求封装成对象,将命令的发送者和接受者解耦。本质上是对方法调用的封装。通过封装方法调用,也可以做一些有意思的事,例如记录日志,或者重复使用这些封装来实现撤销(undo)、重做(redo)操作。1. 你曾见过的命令模式某日,著名门派蛋黄派于江湖互联网发布江湖通缉令一张「通缉偷电瓶车贼窃格瓦拉,抓捕归案奖鸭蛋 10 个」。对于通缉令............原创 2019-12-10 16:07:08 · 353 阅读 · 0 评论 -
JavaScript 设计模式学习第二十二篇-迭代器模式
迭代器模式(Iterator Pattern)用于顺序地访问聚合对象内部的元素,又无需知道对象内部结构。使用了迭代器之后,使用者不需要关心对象的内部构造,就可以按序访问其中的每个元素。1. 什么是迭代器银行里的点钞机就是一个迭代器,放入点钞机的钞票里有不同版次的人民币,每张钞票的冠字号也不一样,但当一沓钞票被放入点钞机中,使用者并不关心这些差别,只关心钞票的数量,以及是否有假币。这里我.........原创 2019-12-09 20:09:37 · 359 阅读 · 0 评论 -
JavaScript 设计模式学习第二十一篇-模板方法模式
模板方法模式(Template Method Pattern)父类中定义一组操作算法骨架,而将一些实现步骤延迟到子类中,使得子类可以不改变父类的算法结构的同时,重新定义算法中的某些实现步骤。模板方法模式的关键是算法步骤的骨架和具体实现分离。1. 你曾见过的模板方法模式这里举个经典的咖啡厅例子,咖啡厅制作饮料的过程有一些类似的步骤:1. 先把水煮沸2. 冲泡饮料(咖啡、茶、牛奶)...............原创 2019-12-09 16:48:22 · 425 阅读 · 0 评论 -
JavaScript 设计模式学习第二十篇-状态模式
状态模式(State Pattern)允许一个对象在其内部状态改变时改变它的行为,对象看起来似乎修改了它的类,类的行为随着它的状态改变而改变。当程序需要根据不同的外部情况来做出不同操作时,最直接的方法就是使用 switch-case或 if-else语句将这些可能发生的情况全部兼顾到,但是这种做法应付复杂一点的状态判断时就有点力不从心,开发者得找到合适的位置添加或修改代码,这个过程很容易出.........原创 2019-12-09 14:35:42 · 551 阅读 · 0 评论 -
JavaScript 设计模式学习第十九篇-策略模式
策略模式(Strategy Pattern)又称政策模式,其定义一系列的算法,把它们一个个封装起来,并且使它们可以互相替换。封装的策略算法一般是独立的,策略模式根据输入来调整采用哪个算法。关键是策略的实现和使用分离。1. 你曾见过的策略模式现在电子产品种类繁多,尺寸多种多样,有时候你会忍不住想拆开看看里面啥样(想想小时候拆的玩具车还有遥控器),但是螺丝规格很多,螺丝刀尺寸也不少,如果每碰到.........原创 2019-12-08 21:15:47 · 462 阅读 · 0 评论 -
JavaScript 设计模式学习第十八篇-发布-订阅模式
在众多设计模式中,可能最常见、最有名的就是发布 - 订阅模式了,本篇我们一起来学习这个模式。发布 - 订阅模式(Publish-Subscribe Pattern, pub-sub)又叫观察者模式(Observer Pattern),它定义了一种一对多的关系,让多个订阅者对象同时监听某一个发布者,或者叫主题对象,这个主题对象的状态发生变化时就会通知所有订阅自己的订阅者对象,使得它们能够自动更新............原创 2019-12-04 14:02:06 · 2366 阅读 · 3 评论 -
JavaScript 设计模式学习第十七篇-桥接模式
桥接模式(Bridge Pattern)又称桥梁模式,将抽象部分与它的实现部分分离,使它们都可以独立地变化。使用组合关系代替继承关系,降低抽象和实现两个可变维度的耦合度。抽象部分和实现部分可能不太好理解,举个例子,香蕉、苹果、西瓜,它们共同的抽象部分就是水果,可以吃,实现部分就是不同的水果实体。再比如黑色手提包、红色钱包、蓝色公文包,它们共同的抽象部分是包和颜色,这部分的共性就可以被作为抽象提...............原创 2019-12-02 15:23:40 · 705 阅读 · 0 评论 -
JavaScript 设计模式学习第十六篇-组合模式
组合模式(Composite Pattern)又叫整体-部分模式,它允许你将对象组合成树形结构来表现整体-部分层次结构,让使用者可以以一致的方式处理组合对象以及部分对象。1. 你曾见过的组合模式大家电脑里的文件夹结构相比很熟悉了,文件夹下面可以有子文件夹,也可以有文件,子文件夹下面还可以有文件夹和文件,以此类推,共同组成了一个文件树,结构如下:Folder 1├── Folder .........原创 2019-12-01 23:50:55 · 317 阅读 · 0 评论 -
JavaScript 设计模式学习第十五篇-外观模式
外观模式(Facade Pattern)又叫门面模式,定义一个将子系统的一组接口集成在一起的高层接口,以提供一个一致的外观。外观模式让外界减少与子系统内多个模块的直接交互,从而减少耦合,让外界可以更轻松地使用子系统。本质是封装交互,简化调用。外观模式在源码中使用很多,具体可以参考后文中源码阅读部分。1. 你曾见过的外观模式最近这些年无人机很流行,特别是大疆的旋翼无人机。旋翼无人机的种类............原创 2019-12-01 20:24:01 · 442 阅读 · 0 评论 -
JavaScript 设计模式学习第十四篇-装饰者模式
装饰者模式(Decorator Pattern)又称装饰器模式,在不改变原对象的基础上,通过对其添加属性或方法来进行包装拓展,使得原有对象可以动态具有更多功能。本质是功能动态组合,即动态地给一个对象添加额外的职责,就增加功能角度来看,使用装饰者模式比用继承更为灵活。好处是有效地把对象的核心职责和装饰功能区分开,并且通过动态增删装饰去除目标对象中重复的装饰逻辑。1. 你曾见过的装饰者模式............原创 2019-11-28 15:42:17 · 425 阅读 · 0 评论 -
JavaScript 设计模式学习第十三篇-适配器模式
适配器模式(Adapter Pattern)又称包装器模式,将一个类(对象)的接口(方法、属性)转化为用户需要的另一个接口,解决类(对象)之间接口不兼容的问题。主要功能是进行转换匹配,目的是复用已有的功能,而不是来实现新的接口。也就是说,访问者需要的功能应该是已经实现好了的,不需要适配器模式来实现,适配器模式主要是负责把不兼容的接口转换成访问者期望的格式而已。1. 你曾见过的适配器模式..................原创 2019-11-27 14:53:30 · 401 阅读 · 0 评论 -
JavaScript 设计模式学习第十二篇-享元模式
享元模式(Flyweight Pattern)运用共享技术来有效地支持大量细粒度对象的复用,以减少创建的对象的数量。享元模式的主要思想是 共享细粒度对象 ,也就是说如果系统中存在多个相同的对象,那么只需共享一份就可以了,不必每个都去实例化每一个对象,这样来精简内存资源,提升性能和效率。Fly 意为苍蝇,Flyweight 指轻蝇量级,指代对象粒度很小。1. 你曾见过的享元模式.........原创 2019-11-23 11:06:28 · 491 阅读 · 0 评论 -
JavaScript 设计模式学习第十一篇-代理模式
代理模式(Proxy Pattern)又称委托模式,它为目标对象创造了一个代理对象,以控制对目标对象的访问。代理模式把代理对象插入到访问者和目标对象之间,从而为访问者对目标对象的访问引入一定的间接性。正是这种间接性,给了代理对象很多操作空间,比如在调用目标对象前和调用后进行一些预操作和后操作,从而实现新的功能或者扩展目标的功能。1. 你曾见过的代理模式明星总是有个助理,或者说经纪人,如.........原创 2019-11-22 16:04:22 · 398 阅读 · 0 评论 -
JavaScript 设计模式学习第十篇-建造者模式
建造者模式(Builder Pattern)又称生成器模式,分步构建一个复杂对象,并允许按步骤构造。同样的构建过程可以采用不同的表示,将一个复杂对象的 构建层与其表示层分离。在工厂模式中,创建的结果都是一个完整的个体,我们对创建的过程并不关心,只需了解创建的结果。而在建造者模式中,我们关心的是对象的创建过程,因此我们通常将创建的复杂对象的模块化,使得被创建的对象的每一个子模块都可以得到高质量的............原创 2019-11-21 22:49:48 · 705 阅读 · 0 评论 -
JavaScript 设计模式学习第九篇- 抽象工厂模式
工厂模式 (Factory Pattern),根据输入的不同返回不同类的实例,一般用来创建同一类对象。工厂方式的主要思想是将对象的创建与对象的实现分离。抽象工厂 (Abstract Factory):通过对类的工厂抽象使其业务用于对产品类簇的创建,而不是负责创建某一类产品的实例。关键在于使用抽象类制定了实例的结构,调用者直接面向实例的结构编程,从实例的具体实现中解耦。我们知道 JavaSc..................原创 2019-11-21 09:40:55 · 799 阅读 · 0 评论 -
JavaScript 设计模式学习第八篇- 工厂模式
工厂模式(Factory Pattern),根据不同的输入返回不同类的实例,一般用来创建同一类对象。工厂方式的主要思想是将对象的创建与对象的实现分离。1. 你曾见过的工厂模式今天你的老同学找你来玩,你决定下个馆子(因为不会做饭),于是你来到了小区门口的饭店,跟老板说,来一份鱼香肉丝,一份宫保鸡丁。等会儿菜就烧好端到你的面前,不用管菜烧出来的过程,你只要负责吃就行了。上面这两个...............原创 2019-11-20 13:08:23 · 621 阅读 · 0 评论 -
JavaScript 设计模式学习第七篇- 单例模式
单例模式可能是设计模式里面最简单的模式了,虽然简单,但在我们日常生活和编程中却经常接触到,本节我们一起来学习一下。单例模式(Singleton Pattern)又称为单体模式,保证一个类只有一个实例,并提供一个访问它的全局访问点。也就是说,第二次使用同一个类创建新对象的时候,应该得到与第一次创建的对象完全相同的对象。1. 你曾经遇见过的单例模式当我们在电脑上玩经营类的游戏,经过一............原创 2019-11-20 01:02:40 · 653 阅读 · 0 评论 -
JavaScript 设计模式学习第六篇-设计原则
在前文我们介绍了面向对象三大特性之继承,本文将主要介绍面向对象六大原则中的单一职责原则(SRP)、开放封闭原则(OCP)、最少知识原则(LKP)。设计原则是指导思想,从思想上给我们指明程序设计的正确方向,是我们在开发设计过程中应该尽力遵守的准则。而设计模式是实现手段,因此设计模式也应该遵守这些原则,或者说,设计模式就是这些设计原则的一些具体体现。要达到的目标就是高内聚低耦合,高内聚是说模块内部.........原创 2019-11-17 20:15:39 · 269 阅读 · 0 评论 -
JavaScript 设计模式学习第五篇-继承与原型链
JavaScript 是一种灵活的语言,兼容并包含面向对象风格、函数式风格等编程风格。我们知道面向对象风格有三大特性和六大原则,三大特性是封装、继承、多态,六大原则是单一职责原则(SRP)、开放封闭原则(OCP)、里氏替换原则(LSP)、依赖倒置原则(DIP)、接口分离原则(ISP)、最少知识原则(LKP)。JavaScript 并不是强面向对象语言,因此它的灵活性决定了并不是所有面向...............原创 2019-11-17 15:17:30 · 327 阅读 · 0 评论 -
JavaScript 设计模式学习第四篇-ES6 中可能遇到的知识点
ES6(ECMAScript 6,ES2015)原来指的是 ECMA 组织在 2015 年发布的 ECMAScript 2015 标准,以后发布的 ECMAScript 2016 对应 ES7,依此类推。今年发布的 ECMAScript 2019 标准对应的就是 ES10。相比于之后发布的这些版本,ES6 的改变幅度非常大,因此我们通常说的 ES6 广义上也包括 ES5 之后的所有更新。下面介...............原创 2019-11-16 20:50:21 · 525 阅读 · 0 评论 -
JavaScript 设计模式学习第三篇- 闭包与高阶函数
JavaScript 中,函数是一等公民,在各种书籍和文章中我们总能看到这句话。既然有一等,那么当然也有次等了。如果公民分等级,一等公民什么都可以做,次等公民这不能做那不能做。JavaScript 的函数也是对象,可以有属性,可以赋值给一个变量,可以放在数组里作为元素,可以作为其他对象的属性,什么都可以做,别的对象能做的它能做,别的对象不能做的它也能做,这不就是一等公民的地位嘛。 ............原创 2019-11-12 00:46:19 · 364 阅读 · 0 评论 -
JavaScript 设计模式学习第二篇-关于this、new、bind、call、apply
虽然标题关于this、new、bind、call、apply,但实际上这些都离不开 this,因此本文将着重讨论 this,在此过程中分别讲解其他知识点。1. this 指向的类型刚开始学习 JavaScript 的时候,this总是最能让人迷惑,下面我们一起看一下在 JavaScript 中应该如何确定 this的指向。this是在函数被调用时确定的,它的指向完全取决于函数调用的地............原创 2019-11-09 12:14:48 · 450 阅读 · 0 评论 -
JavaScript 设计模式学习第一篇-设计模式简介
1. 什么是设计模式小时候打游戏,我们总是追求最快通关;朋友聚会,我们会拿出手机查看哪家店离得近,而且实惠又好吃;下班回寝室,我们总是选最便捷的路线坐车。我们总是追求一件事最优美最便捷的解决方法,也就是最佳实践。设计模式就相当于武功秘籍里面的招式,是先辈们总结出来的最佳实践,如果在遇到合适的场景时施展,则事半功倍,以后扩展和阅读都十分舒畅,如读诗行,如沐春风。然而招式运转在乎融会贯通、心.........原创 2019-11-08 19:20:44 · 432 阅读 · 0 评论