加入收藏 | 设为首页 | 会员中心 | 我要投稿 西安站长网 (https://www.029zz.com.cn/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 建站 > 正文

掌握前端5大常用设计模式,瞬间高大上

发布时间:2019-04-03 05:27:14 所属栏目:建站 来源:IT实战联盟
导读:副标题#e# 今天主要介绍一下我们平常会经常用到的设计模式,设计模式总的来说有23种,而设计模式在前端中又该怎么运用呢,接下来主要对比较前端中常见的设计模式做一个介绍。 设计模式的定义 设计模式是在面向对象软件设计过程中针对特定问题的简洁而优雅的

总结:在简单工厂中,如果我们新增加一个用户类型,需要修改两个地方的代码,一个是增加新的用户构造函数,一个是在逻辑判断中增加对新的用户的判断,而在抽象工厂方法中,我们只需要在UserFactory.prototype中添加就可以啦。

二、单例模式

定义:是保证一个类只有一个实例,并且提供一个访问它的全局访问点。

需求:一些对象我们往往只需要一个,比如线程池、全局缓存、浏览器中的window对象、登录浮窗等。

实现:用一个变量标识当前是否已经为某个类创建过对象,如果是,则在下一次获取这个类的实例时,直接返回之前创建的对象。

优点:

  • 可以用来划分命名空间,减少全局变量的数量
  • 可以被实例化,且实例化一次,再次实例化生成的也是第一个实例

下面举个例子,在js中,我们可以使用闭包来创建实现这种模式:

  1. var single = (function(){ 
  2.  var unique; 
  3.  function getInstance(){ 
  4.  // 如果该实例存在,则直接返回,否则就对其实例化 
  5.  if( unique === undefined ){ 
  6.  unique = new Construct(); 
  7.  } 
  8.  return unique; 
  9.  } 
  10.  function Construct(){ 
  11.  // ... 生成单例的构造函数的代码 
  12.  } 
  13.  return { 
  14.  getInstance : getInstance 
  15.  } 
  16. })(); 

总结:在上面的代码中,我们可以使用single.getInstance来获取到单例,并且每次调用均获取到同一个单例,在我们平时的开发中,我们也经常会用到这种模式,比如当我们单击登录按钮的时候,页面中会出现一个登录框,而这个浮窗是唯一的,无论单击多少次登录按钮,这个浮窗只会被创建一次,因此这个登录浮窗就适合用单例模式。

三、代理模式

代理模式主要是为其他对象提供一种代理以控制对这个对象的访问,主要解决在直接访问对象时带来的问题,比如说:要访问的对象在远程的机器上,在面向对象系统中,有些对象由于某些原因(比如对象创建开销很大,或者某些操作需要安全控制,或者需要进程外的访问),直接访问会给使用者或者系统结构带来很多麻烦,我们可以在访问此对象时加上一个对此对象的访问层。

(编辑:西安站长网)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

热点阅读