
js设计模式
js设计模式
仇益阳
技术无罪
展开
-
如何让进行代码重构?
提炼函数在JavaScript开发中,我们大部分时间都在与函数打交道,所以我们希望这些函数有着良好的命名,函数体内包含的逻辑清晰明了。如果一个函数过长,不得不加上若干注释才能让这个函数显得易读一些,那这些函数就很有必要进行重构如果在函数中有一段代码可以被独立出来,那我们最好把这些代码放进另外一个独立的函数中。这是一种很常见的优化工作,这样做的好处主要有以下几点。避免出现超大函数。独立出来...原创 2019-12-11 23:42:16 · 13931 阅读 · 0 评论 -
设计原则和编程技巧之开放-封闭原则
什么是开放-封闭原则(ocp)定义:软件实体(类、模块、函数)等应该是可以扩展的,但是不可修改。思想:当需要改变一个程序的功能或者给这个程序增加新功能的时候,可以使用增加代码的方式,但是不允许改动程序的源代码。用对象的多态性消除条件分支过多的条件分支语句是造成程序违反开放-封闭原则的一个常见原因。每当需要增加一个新的if语句时,都要被迫改动原函数。把if换成switch-case是没有...原创 2019-12-11 01:09:38 · 14037 阅读 · 0 评论 -
设计原则和编程技巧之最少知识原则
什么是最少知识原则?最少知识原则(LKP)说的是一个软件实体应当尽可能少地与其他实体发生相互作用。这里的软件实体是一个广义的概念,不仅包括对象,还包括系统、类、模块、函数、变量等。本节我们主要针对对象来说明这个原则,下面引用《面向对象设计原理与模式》一书中的例子来解释最少知识原则:某军队中的将军需要挖掘一些散兵坑。下面是完成任务的一种方式:将军可以通知上校让他叫来少校,然后让少校找来上尉,并让...原创 2019-12-11 01:06:47 · 13949 阅读 · 0 评论 -
设计原则和编程技巧之单一职责原则
什么是单一职责原则(SRP)?单一职责原则(SRP)的职责被定义为“引起变化的原因”。如果我们有两个动机去改写一个方法,那么这个方法就具有两个职责。每个职责都是变化的一个轴线,如果一个方法承担了过多的职责,那么在需求的变迁过程中,需要改写这个方法的可能性就越大。此时,这个方法通常是一个不稳定的方法,修改代码总是一件危险的事情,特别是当两个职责耦合在一起的时候,一个职责发生变化可能会影响到其他职...原创 2019-12-11 01:06:14 · 13860 阅读 · 0 评论 -
JavaScript设计模式之适配器模式
引适配器模式的作用是解决两个软件实体间的接口不兼容的问题。使用适配器模式之后,原本由于接口不兼容而不能工作的两个软件实体可以一起工作。港式插头转换器适配器的别名是包装器(wrapper),这是一个相对简单的模式。在程序开发中有许多这样的场景:当我们试图调用模块或者对象的某个接口时,却发现这个接口的格式并不符合目前的需求。这时候有两种解决办法,第一种是修改原来的接口实现,但如果原来的模块很复杂,...原创 2019-12-10 23:51:43 · 14006 阅读 · 0 评论 -
JavaScript设计模式之状态模式
什么是状态模式?状态模式是一种非同寻常的优秀模式,它也许是解决某些需求场景的最好方法。虽然状态模式并不是一种简单到一目了然的模式(它往往还会带来代码量的增加),但你一旦明白了状态模式的精髓,以后一定会感谢它带给你的无与伦比的好处。状态模式的关键是区分事物内部的状态,事物内部状态的改变往往会带来事物的行为改变。初识状态模式我们来想象这样一个场景:有一个电灯,电灯上面只有一个开关。当电灯开着的...原创 2019-12-09 21:16:16 · 14388 阅读 · 0 评论 -
JavaScript设计模式之装饰者模式
引:什么是装饰者模式在传统的面向对象语言中,给对象添加功能常常使用继承的方式,但是继承的方式并不灵活,还会带来许多问题:一方面会导致超类和子类之间存在强耦合性,当超类改变时,子类也会随之改变;另一方面,继承这种功能复用方式通常被称为“白箱复用”,“白箱”是相对可见性而言的,在继承方式中,超类的内部细节是对子类可见的,继承常常被认为破坏了封装性。使用继承还会带来另外一个问题,在完成一些功能复用的...原创 2019-12-08 23:56:07 · 13932 阅读 · 0 评论 -
JavaScript设计模式之享元模式
什么是享元模式?享元(flyweight)模式是一种用于性能优化的模式,“fly”在这里是苍蝇的意思,意为蝇量级。享元模式的核心是运用共享技术来有效支持大量细粒度的对象。如果系统中因为创建了大量类似的对象而导致内存占用过高,享元模式就非常有用了。在JavaScript中,浏览器特别是移动端的浏览器分配的内存并不算多,如何节省内存就成了一件非常有意义的事情。享元模式的概念初听起来并不太好理解,...原创 2019-12-05 22:42:18 · 14006 阅读 · 0 评论 -
JavaScript 设计模式之模板方法模式
引在JavaScript开发中用到继承的场景其实并不是很多,很多时候我们都喜欢用mix-in的方式给对象扩展属性。但这不代表继承在JavaScript里没有用武之地,虽然没有真正的类和继承机制,但我们可以通过原型prototype来变相地实现继承。模板方法模式是一种只需使用继承就可以实现的非常简单的模式。模板方法模式由两部分结构组成,第一部分是抽象父类,第二部分是具体的实现子类。通常在抽象父...原创 2019-12-03 22:19:46 · 13992 阅读 · 0 评论 -
JavaScript 设计模式之组合模式
引我们知道地球和一些其他行星围绕着太阳旋转,也知道在一个原子中,有许多电子围绕着原子核旋转。我曾经想象,我们的太阳系也许是一个更大世界里的一个原子,地球只是围绕着太阳原子的一个电子。而我身上的每个原子又是一个星系,原子核就是这个星系中的恒星,电子是围绕着恒星旋转的行星。一个电子中也许还包含了另一个宇宙,虽然这个宇宙还不能被显微镜看到,但我相信它的存在。也许这个想法有些异想天开,但在程序设计中,...原创 2019-12-02 22:39:27 · 14526 阅读 · 0 评论 -
JavaScript 设计模式之发布-订阅模式(下)
发布-订阅模式的通用实现现在我们在上一篇文章中已经看到了如何让售楼处拥有接受订阅和发布事件的功能。假设现在小明又去另一个售楼处买房子,那么这段代码是否必须在另一个售楼处对象上重写一次呢,有没有办法可以让所有对象都拥有发布—订阅功能呢?答案是肯定的!如何构建?首先我们要理解发布订阅设计模式中的基本构造发布订阅集合列表增加订阅方法移除订阅方法这以上四部即为基本的发布订阅设计模式中...原创 2019-11-30 23:50:54 · 18847 阅读 · 0 评论 -
JavaScript 设计模式之发布-订阅模式(上)
什么是发布订阅模式?发布—订阅模式又叫观察者模式,它定义对象间的一种一对多的依赖关系,当一个对象的状态发生改变时,所有依赖于它的对象都将得到通知。在JavaScript开发中,我们一般用事件模型来替代传统的发布—订阅模式。发布订阅模式的构成最常见的发布订阅模式就是咱们DOM事件,仔细回想一下我们要给一个按钮,绑定一个事件,当我点击按钮的时候我要让他的颜色变了,并且页面弹出一个弹出框我们分析...原创 2019-11-29 23:56:49 · 18738 阅读 · 0 评论 -
JavaScript 设计模式之迭代器模式
什么是迭代器模式?迭代器模式是指提供一种方法顺序访问一个聚合对象中的各个元素,而又不需要暴露该对象的内部表示。迭代器模式可以把迭代的过程从业务逻辑中分离出来,在使用迭代器模式之后,即使不关心对象的内部构造,也可以按顺序访问其中的每个元素。jQuery中的迭代器迭代器模式无非就是循环访问聚合对象中的各个元素。比如jQuery中的$.each函数,其中回调函数中的参数i为当前索引,n为当前元素,...原创 2019-11-28 22:25:41 · 19110 阅读 · 0 评论 -
JavaScript 设计模式之代理模式
什么是代理模式?首先我们先看一个有趣的例子在四月一个晴朗的早晨,小明遇见了他的百分百女孩,我们暂且称呼小明的女神为A。两天之后,小明决定给A送一束花来表白。刚好小明打听到A和他有一个共同的朋友B,于是内向的小明决定让B来代替自己完成送花这件事情。虽然小明的故事必然以悲剧收场,因为追MM更好的方式是送一辆宝马。不管怎样,我们还是先用代码来描述一下小明追女神的过程,先看看不用代理模式的情况://...原创 2019-11-27 22:49:14 · 20487 阅读 · 0 评论 -
JavaScript 设计模式之策略模式
什么是策略模式?策略模式的定义是:定义一系列的算法,把它们一个个封装起来,并且使它们可以相互替换。使用策略模式计算奖金很多公司的年终奖是根据员工的工资基数和年底绩效情况来发放的。例如,绩效为S的人年终奖有4倍工资,绩效为A的人年终奖有3倍工资,而绩效为B的人年终奖是2倍工资。假设财务部要求我们提供一段代码,来方便他们计算员工的年终奖。不使用策略模式我们可以编写一个名为calcula...原创 2019-11-26 23:46:07 · 20613 阅读 · 0 评论 -
JavaScript 设计模式之js中的单例模式
javascript是一门无类语言,也正是因为如此,生搬硬套单例模式的概念毫无意义。在Javascript中创建对象的方法非常简单,既然我们只需要一个唯一的“对象”,为什么要为它先创建一个“类呢”?单例模式的核心是:确保只有一个实例,并且提供全局访问全局模式不是单例模式,但在Javascript开发中,我们经常会把全局变量当作单例来使用。例如:var a={};当用这种方式创建对象a的时...原创 2019-11-25 22:07:22 · 21646 阅读 · 0 评论 -
JavaScript 设计模式之单例模式
什么是单例模式?单例模式的定义是:保证一个类仅有一个实例,并提供一个访问它的全局访问点单例模式是一种常用的模式,有一些对象往往我们只需要哦一个,比如线程池,全局缓存,浏览器中的Windows对象等。在JavaScript中,单例模式的用途非常广泛,试想一下,当我们单击登陆按钮的时候,页面上会出现一个悬浮框,并且这个悬浮框是唯一的,无论点击多少次登陆按钮,这个悬浮窗只会出现一次,那么这个登...原创 2019-11-24 23:56:07 · 24988 阅读 · 0 评论 -
JavaScript 设计模式之命令模式
什么是命令模式?假设有一个快餐店,而我是该餐厅的点餐服务员,那么我一天的工作应该是这样的:当某位客人点餐或者打来订餐电话后,我会把他的需求都写在清单上,然后交给厨房,客人不用关心是哪些厨师帮他炒菜。我们餐厅还可以满足客人需要的定时服务,比如客人可能当前正在回家的路上,要求1个小时后才开始炒他的菜,只要订单还在,厨师就不会忘记。客人也可以很方便地打电话来撤销订单。另外如果有太多的客人点餐,厨房可以...原创 2019-12-01 21:08:09 · 18797 阅读 · 0 评论