![](https://img-blog.csdnimg.cn/20201014180756913.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
JavaScript设计模式
文章平均质量分 66
闲人王昱珩
不忘初心,就不错了
展开
-
JavaScript设计模式(12)—— 装饰器模式
装饰器模式的定义装饰器模式=表面意思,当用户发出相同的请求,如调用一个名为work()的函数,有些人的作息是955,而被装饰之后,就变成996了。用代码复现一下上面的场景如下所示:let work = function(){ console.log('work:9:00 - 17:00') } let _work = work work = function(){ _work() console.log('work:17:00 - 21:00') } work()原创 2021-01-19 14:59:03 · 479 阅读 · 1 评论 -
JavaScript设计模式(11)—— 中介者模式
现实中的中介者 —— 婚介中心婚介中心往往搜罗了大量的男男女女信息,当我们去婚介所请求一个“对象”的时候,婚介所通常都是先把你的信息录入到系统之中,然后婚介所会把你需要的“对象们”介绍给你。同时你也会被作为一个样本,被介绍给别人。当A和B发生关系的时候,B和C可能也在搞对象,而A也可能和D还有一腿。这个时候你作为A,你想要得知你的B在跟谁乱搞男女关系,你就得向婚介所求证了。同时婚介所在知道A和B开始正式搞对象的时候,应该通知B的对象们,B已经和A在搞男女关系了。在上面的系统中,用户都是通过婚介所这原创 2021-01-15 14:12:56 · 350 阅读 · 0 评论 -
JavaScript设计模式(10)—— 职责链模式
职责链模式!=‘学术命名’我在本系列的第一篇文章里阐述过一个原则:即学习设计模式并不能帮助你优化代码,经常是给你现有的代码进行学术命名,而本章的内容可能不属于“学术命名”范畴了,职责链模式是一种彻彻底底的我在教你做事模式。职责链模式的使用场景不管是任何设计模式,都有属于自己适用的场景,而职责链模式的使用场景跟它的名字一样,将一个请求不断地传递,直到遇到能处理他的函数为止。当然为了确保请求能被处理,请至少有一个保底函数来处理那些错误请求,比如你想找工作,但你把这个请求发送到淘宝去了,那这个请求不管怎么传原创 2021-01-13 16:46:47 · 257 阅读 · 1 评论 -
JavaScript设计模式(9)—— 享元模式
享元模式=节约资源模式享元模式,顾名思义,就是分享“对象”的一个模式。例如学校里的图书馆,可能每种类型的书只有十几本,但是却能让一代又一代的学生都能看上这些书,这里就用到了享元模式。通过借阅书籍并归还的例子我们可以得出结论:享元模式是一种节约资源的模式。最最简单的例子在前端代码层面,我们通常会创建一些相似的对象来解决相似的问题。下面我们把图书馆的例子翻译成代码来介绍享元模式。如:A同学借阅《设计模式》,B同学借阅《设计模式》,C同学借阅《设计模式》,A同学借阅《模式设计》…class Lib原创 2020-12-17 15:50:00 · 269 阅读 · 1 评论 -
JavaScript设计模式(8)—— 模板方法模式
模板方法模式基于继承?呵呵明人不说暗话,我在看文章的时候,歪瑞讨厌看到诸如“继承”,“抽象类”,“父类子类爷爷类”之类的“非JS专用词汇”。恰巧模板方法模式上来就是一句:模板方法是一种基于继承的设计模式。后面还强调了一句:模板方法模式是一种只需使用继承就可以实现的非常简单的模式。对于不喜欢“继承”的我而言,还得去温习一下继承,为了写文章我去把ES6 class部分的语法过了一遍再看这一章,然后最气的事情发生了,看完之后我发现模板方法模式根本不需要继承!经典例子coffee or tea看过原著的都知道原创 2020-11-25 17:00:45 · 290 阅读 · 1 评论 -
JavaScript设计模式(7)—— 组合模式
回顾宏命令在讲组合模式之前,我们先来回顾一下上一章节的命令模式。刚才同事让我帮忙灌溉一下办公室里的花花草草,在这个例子中,command的发起者是同事,他希望我执行以下excute函数浇灌一下花花草草,恰巧办公室里有好几盆盆栽,每一种植物的浇灌方式还不一样(第一次知道浇水还要看说明书)。于是产生了以下代码。//同事var commander = { // 接收参数植物种类 pushCommand:function(plant){ // 执行共识函数excute plant.excu原创 2020-11-12 15:48:36 · 271 阅读 · 0 评论 -
JavaScript设计模式(6)—— 命令模式
命令模式是什么?命令模式最常见的应用场景是:有时候需要向某些对象发送请求,但是并不知道请求的接收者是谁,也不知道被请求的操作是什么。此时希望用一种松耦合的方式来设计程序,使得请求发送者和请求接收者能够消除彼此之间的耦合关系。上面这段话其实是出自原著对命令模式的解释,看起来通俗易懂,其实坑多的一批。要读懂这句话,最关键的是读懂what is “不知道请求的接收者是谁,也不知道被请求的操作是什么”?这段话会在后面被反复反复反复提及,这里先画个重点,读完这篇文章后,如果你能完全了解上面这句话,并且能察觉出原创 2020-11-05 17:27:01 · 276 阅读 · 0 评论 -
JavaScript设计模式(5)——发布者-订阅模式
发布者订阅模式是什么?发布者订阅模式又称观察者模式,它定义对象间的一种一对多的依赖关系,当一个对象的状 态发生改变时,所有依赖于它的对象都将得到通知。简(shuo)而(ju)言(ren)之(hua),发布者-订阅模式就是由发布者和订阅者组成的一种应用场景。以项目组为例,产品经理(或甲方)往往承担发布者的责任,负责推送需求到某工作群里,发出需求后,其他打工仔的手机就会滴滴滴的响,滋滋滋的震,这是因为这些打工仔订阅了这些消息,然后不同职责的打工仔就可以做不同的事情去响应这个需求。当然在这个群里的可能还有公司原创 2020-10-27 15:26:42 · 4094 阅读 · 12 评论 -
JavaScript设计模式(4)—— 迭代器模式
迭代器模式的核心就是——提供一种方法使你能够遍历到对象中的每一个元素,并对他们做类似的处理。 说人话就是——常见的数组处理方式。如forEach,map,some,every之类的通常我们用来处理数组方法给他们取个高大上的名字就是迭代器。 在JavaScript中,除了数组之外,普通对象也可以通过for in遍历,因此我们可以写一个通用的迭代器来处理"对象"。function iterator(obj,fn){ if (Object.prototype.toString.call(o...原创 2020-09-22 16:53:45 · 406 阅读 · 1 评论 -
JavaScript设计模式(3)—— 代理模式
代理模式是为一个对象提供一个代用品或占位符,以便控制对它的访问。 说人话就是:你想吃外卖变成,你委托骑手去店里拿外卖送到你手里。 代理模式的核心就是:丰富过程,结果不变。 以吃外卖的例子为例,我想吃外卖,这个事件的发起人是我,这个事件的结果是,吃外卖。 丰富一下这其中的过程: 我想吃外卖,我在APP上下单,骑手去店里拿外卖,骑手送外卖到我手里,我吃外卖。 再丰富一下过程: 我想吃外卖,我在APP上下单,骑手去店里拿外卖,店家说今天没进货,不开门营业,骑手到我家...原创 2020-09-16 16:02:42 · 531 阅读 · 0 评论 -
JavaScript设计模式(2)—— 策略模式
策略模式的定义是:定义一系列的算法,把它们一个个封装起来,并且使它们可以相互替换。 讲人话就是:定义一系列算法逻辑,处理类似的业务场景。 讲JavaScript话就是:你知道Math吗?就是把一堆数学方法整合到Math对象里,你可以很方便的调用这个对象的方法解决加减乘除等各种各样的数学问题。因此我提供一种常见的策略模式的写法,你们大概就能明白自己的哪些代码运用了策略模式了,代码如下:const Mymath = { add:function(){ const realArg = ...原创 2020-09-16 13:48:42 · 403 阅读 · 1 评论 -
JavaScript设计模式(1)—— 单例模式
单例模式的定义是:保证一个"类"仅有一个实例,并提供一个访问它的全局访问点。单例模式的类是一个只需要被创建一次变量(这并不代表他被创建后是不可更改的),因此我们需要一个通用的方法来确定某个类是否被创建过,只需要通过一把锁去判断这个类是否被创建过即可。因此我们先推出一个通用的单例模式创建方式,代码如下:<script type="text/javascript"> // 我们把业务逻辑封装在fn里通过变量的形式传入 function createSingle(fn){ ...原创 2020-09-15 17:09:36 · 517 阅读 · 2 评论 -
JavaScript设计模式(0)—— 学设计模式有个鸟用?
通常在任何系列开始之前,我都会写一篇简短的预告,将这个系列的实践意义进行提取进行总结,以便初学者不需要看具体的内容也可以通过看个开头就决定需不需要学习这部分的内容,在我的许多文章中都有这样的"FBI Warning"。所以在这篇文章中我会先把个人目前所学进行一个简短的总结。 首先这个系列参考的书籍是曾探——《JavaScript设计模式与开发实践》。简单的评价下这本书与这个作者,个人认为这本书写的很好,基本上作为给人来看的东西,内容是十分合格的,没有什么绕来绕去的地方,例子也都通俗易懂。但是作者就...原创 2020-09-02 15:00:11 · 834 阅读 · 3 评论