- 博客(22)
- 资源 (2)
- 收藏
- 关注
RSS订阅原创 前端设计之模式动机
模式动机考虑一个简单的应用场景，一个系统可以提供多个外观不同的按钮（如圆形按钮、矩形按钮、菱形按钮等），这些按钮都源自同一个基类，不过在继承基类后不同的子类修改了部分属性从而使得它们可以呈现不同的外观，如果我们希望在使用这些按钮时，不需要知道这些具体按钮类的名字，只需要知道表示该按钮类的一个参数，并提供一个调用方便的方法，把该参数传入方法即可返回一个相应的按钮对象，此时，就可以使用简单工厂模式。...
2020-04-24 17:54:51
177
原创 前端设计模式之工厂方法模式
简单工厂模式的不足在简单工厂模式中，只提供了一个工厂类，该工厂类处于对产品类进行实例化的中心位置，它知道每一个产品对象的创建细节，并决定何时实例化哪一个产品类。 简单工厂模式最大的缺点是当有新产品要加入到系统中时，必须修改工厂类，加入必要的处理逻辑，这违背了“开闭原则”。 在简单工厂模式中，所有的产品都是由同一个工厂创建，工厂类职责较重，业务逻辑较为复杂，具体产品与工厂类之间的耦合度高，严重影响...
2020-04-24 17:53:59
504
原创 前端设计模式之抽象工厂模式
模式动机在工厂方法模式中具体工厂负责生产具体的产品，每一个具体工厂对应一种具体产品，工厂方法也具有唯一性，一般情况下，一个具体工厂中只有一个工厂方法或者一组重载的工厂方法。但是有时候我们需要一个工厂可以提供多个产品对象，而不是单一的产品对象。为了更清晰地理解工厂方法模式，需要先引入两个概念：产品等级结构：产品等级结构即产品的继承结构，如一个抽象类是电视机，其子类有海尔电视机、海信电视机、T...
2020-04-24 17:53:20
259
原创 前端设计模式之单例模式
模式动机对于系统中的某些类来说，只有一个实例很重要，例如，一个系统中可以存在多个打印任务，但是只能有一个正在工作的任务；一个系统只能有一个窗口管理器或文件系统；一个系统只能有一个计时工具或ID（序号）生成器。如何保证一个类只有一个实例并且这个实例易于被访问呢？定义一个全局变量可以确保对象随时都可以被访问，但不能防止我们实例化多个对象。一个更好的解决办法是让类自身负责保存它的唯一实例。这个类...
2020-04-24 17:52:58
269
原创 前端设计模式之结构型模式
结构型模式概述结构型模式(Structural Pattern)描述如何将类或者对象结合在一起形成更大的结构，就像搭积木，可以通过简单积木的组合形成复杂的、功能更为强大的结构。结构型模式可以分为类结构型模式和对象结构型模式：类结构型模式关心类的组合，由多个类可以组合成一个更大的系统，在类结构型模式中一般只存在继承关系和实现关系。对象结构型模式关心类与对象的组合，通过关联关系使得在一个类中...
2020-04-24 17:51:33
168
原创 前端设计模式之适配器模式
模式动机在软件开发中采用类似于电源适配器的设计和编码技巧被称为适配器模式。适配器模式是一种“亡羊补牢”的模式，没有人在程序的设计之初就使用它。因为没有人可以完全预料到未来的事情，也许现在工作的好好的接口，未来的某天缺不再适用于系统，那么我们就可以通过适配器模式把旧接口包装秤一个新接口，使它继续保持生命力。在适配器模式中可以定义一个包装类，包装不兼容接口的对象，这个包装类指的就是适配器(Ad...
2020-04-24 17:51:04
630
1
原创 前端设计模式之创建型模式概述
创建型模式概述创建型模式(Creational Pattern)对类的实例化过程进行了抽象，能够将软件模块中对象的创建和对象的使用分离。为了使软件的结构更加清晰，外界对于这些对象只需要知道它们共同的接口，而不清楚其具体的实现细节，使整个系统的设计更加符合单一职责原则。创建型模式在创建什么(What)，由谁创建(Who) ，何时创建(When) 等方面都为软件设计者提供了尽可能大的灵活性。创建...
2020-04-24 17:50:27
115
原创 前端设计模式之桥接模式
模式动机设想如果要绘制矩形、圆形、椭圆、正方形，我们至少需要4个形状类，但是如果绘制的图形需要具有不同的颜色，如红色、绿色、蓝色等，此时至少有如下两种设计方案：第一种设计方案是为每一种形状都提供一套各种颜色的版本。第二种设计方案是根据实际需要对形状和颜色进行组合。对于有两个变化维度（即两个变化的原因）的系统，采用方案二来进行设计系统中类的个数更少，且系统扩展更为方便。设计方案二即...
2020-04-24 17:50:09
466
原创 前端设计模式之组合模式
模式动机对于树形结构，当容器对象（如文件夹）的某一个方法被调用时，将遍历整个树形结构，寻找也包含这个方法的成员对象（可以是容器对象，也可以是叶子对象，如子文件夹和文件）并调用执行。（递归调用）由于容器对象和叶子对象在功能上的区别，在使用这些对象的客户端代码中必须有区别地对待容器对象和叶子对象，而实际上大多数情况下客户端希望一致地处理它们，因为对于这些对象的区别对待将会使得程序非常复杂。组...
2020-04-24 17:49:07
402
原创 前端设计模式之外观模式
模式动机引入外观角色之后，用户只需要直接与外观角色交互，用户与子系统之间的复杂关系由外观角色来实现，从而降低了系统的耦合度。模式定义外观模式(Facade Pattern)：外部与一个子系统的通信必须通过一个统一的外观对象进行，为子系统中的一组接口提供一个一致的界面，外观模式定义了一个高层接口，这个接口使得这一子系统更加容易使用。外观模式又称为门面模式，它是一种对象结构型模式。使用频率：...
2020-04-24 17:48:49
323
原创 前端设计模式之代理模式
模式动机在某些情况下，一个客户不想或者不能直接引用一个对象，此时可以通过一个称之为“代理”的第三者来实现间接引用。代理对象可以在客户端和目标对象之间起到中介的作用，并且可以通过代理对象去掉客户不能看到的内容和服务或者添加客户需要的额外服务。通过引入一个新的对象（如小图片和远程代理对象）来实现对真实对象的操作或者将新的对象作为真实对象的一个替身，这种实现机制即为代理模式，通过引入代理对象来间...
2020-04-24 17:48:34
592
原创 前端设计模式之行为型模式
行为型模式概述行为型模式(Behavioral Pattern)是对在不同的对象之间划分责任和算法的抽象化。行为型模式不仅仅关注类和对象的结构，而且重点关注它们之间的相互作用。通过行为型模式，可以更加清晰地划分类与对象的职责，并研究系统在运行时实例对象之间的交互。在系统运行时，对象并不是孤立的，它们可以通过相互通信与协作完成某些复杂功能，一个对象在运行时也将影响到其他对象的运行。行为型...
2020-04-24 17:48:16
182
原创 前端设计模式之职责链模式
模式动机职责链模式职责链可以是一条直线、一个环或者一个树形结构，最常见的职责链是直线型，即沿着一条单向的链来传递请求。链上的每一个对象都是请求处理者，职责链模式可以将请求的处理者组织成一条链，并使请求沿着链传递，由链上的处理者对请求进行相应的处理，客户端无须关心请求的处理细节以及请求的传递，只需将请求发送到链上即可，将请求的发送者和请求的处理者解耦。这就是职责链模式的模式动机。模式定义...
2020-04-24 17:47:59
209
原创 前端设计模式之命令模式
模式动机在软件设计中，我们经常需要向某些对象发送请求，但是并不知道请求的接收者是谁，也不知道被请求的操作是哪个，我们只需在程序运行时指定具体的请求接收者即可，此时，可以使用命令模式来进行设计，使得请求发送者与请求接收者消除彼此之间的耦合，让对象之间的调用关系更加灵活。命令模式可以对发送者和接收者完全解耦，发送者与接收者之间没有直接引用关系，发送请求的对象只需要知道如何发送请求，而不必知道如何...
2020-04-24 17:47:43
316
原创 设计模式的诞生与发展
设计模式的诞生与发展模式起源于建筑业而非软件业模式(Pattern)之父——美国加利佛尼亚大学环境结构中心研究所所长Christopher Alexander博士《A Pattern Language: Towns, Buildings, Construction》——253个建筑和城市规划模式模式Context（模式可适用的前提条件）Theme或Problem（在特定条件下要解决...
2020-04-24 17:47:24
848
原创 前端设计模式之观察者模式
模式动机建立一种对象与对象之间的依赖关系，一个对象发生改变时将自动通知其他对象，其他对象将相应做出反应。在此，发生改变的对象称为观察目标，而被通知的对象称为观察者，一个观察目标可以对应多个观察者，而且这些观察者之间没有相互联系，可以根据需要增加和删除观察者，使得系统更易于扩展，这就是观察者模式的模式动机。模式定义观察者模式(Observer Pattern)：定义对象间的一种一对多依赖关系...
2020-04-24 17:47:08
800
原创 前端设计模式之策略模式
模式动机完成一项任务，往往可以有多种不同的方式，每一种方式称为一个策略，我们可以根据环境或者条件的不同选择不同的策略来完成该项任务。在软件开发中也常常遇到类似的情况，实现某一个功能有多个途径，此时可以使用一种设计模式来使得系统可以灵活地选择解决途径，也能够方便地增加新的解决途径。在软件系统中，有许多算法可以实现某一功能，如查找、排序等，一种常用的方法是 硬编码(Hard Coding) 在...
2020-04-24 17:46:01
453
原创 大话package.json
详谈一下package.json文件的各个字段在日常的开发过程中，我们会发现项目结构里有一个package.json文件，可能我们比较熟知并且经常要翻看或者确认的就是dependencies、devDependencies这几个字段，但除了这几个我们比较熟知的之外，还有一些比较常用也常见的字段。namename字段的限制1、name字段必须小于214字符2、name字段不能包含有“.”符...
2019-03-27 15:25:54
203
原创 在typescript项目中使用第三方插件(以在vue+typescript项目中使用hightcharts为例)
typescript语言最大的特色就是强类型，因此在typescript还远远没有JavaScript普及的时候，我们在使用ts开发项目，需要用到第三方插件时（这类插件基本都是以js开发的）往往强类型语言无法直接编译弱类型语言，因此容易报错。我在实际开发中就遇到了这样的问题，需要在Vue+Typescript项目中实现图表效果，我选择了highcharts作为图表插件，现将解决方案公布如下：
2017-09-05 11:54:35
12773
1
原创 css实现border半透明backround-clip
闲着的时候在网上下载了一个登录页，准备为下一个项目先做做准备。但是做的过程中发现登录页中间login-box的部分边框呈现了半透明实现方式html LOGO css 样式使用的是stylus，这里只是使用了少量的stylus语法
2017-09-01 18:12:53
1133
原创 跨浏览器常用的方法
//跨浏览器开发中的事件 var EventUtil = {addHandler: function(element, type, handler) {if (element.addEventListener) {element.addEventListener(type, handler, false);} else if (element.attachEvent) {element.attac
2017-08-30 15:50:59
305
原创 apache和tomcat的下载、安装和配置（包括部分出错）
1、apache的下载、安装和配置下载官网下载地址：http://httpd.apache.org/download.cgi 点击打开链接1、选择 Files for Microsoft Windows 2、选择一个站点ApacheHaus3、选择一个合适的版本下载4、下载一个.zip安装包之后放在合适的文件夹下，我是放在了C盘2、
2017-07-10 18:34:44
650
JavaScript高级程序设计 第三版
2017-09-04
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人