学习javascript设计模式之单例模式
1、单例模式的核心是确保只有一个实例,并提供全局访问。
2、惰性单例 指的是在需要的时候才创建对象实例。
如在页面中创建唯一div 普通做法
var createDiv = (function(){
var div;
return function(){
if(!div){
div = document.createElement("div");
div.style.width="100px";
div.innerHTML = "fdsafdsafdsafdsa";
div.style.display = 'none';
document.body.appendChild(div);
return div;
}
return div;
}
})();
document.getElementById("btn").onclick = function(){
var loginlayer = createDiv();
loginlayer.style.display = 'block';
}
应用通用惰性单例
var getSingle = function(fn){
var result;
return function(){
return result || (result = fn.apply(this,arguments));
}
}
var createDiv = function(){
var div = document.createElement("div");
div.style.width="100px";
div.innerHTML = "fdsafdsafdsafdsa";
document.body.appendChild(div);
return div;
}
var createSingleDiv = getSingle(createDiv);
document.getElementById("btn").onclick = function(){
var loginlayer = createSingleDiv();
loginlayer.style.display = 'block';
}
学习javascript设计模式之单例模式的更多相关文章
- JavaScript设计模式之单例模式【惰性单例】
在提高开发水平,往中高级前端工程师中,利用设计模式是必不可少的一条道路.掌握设计模式的思想远远比硬套重要,因为设计模式是一种思想,不局限于开发语言.但实际上由于语言的特性不同,往往在实现的时候会有不少 ...
- 再起航,我的学习笔记之JavaScript设计模式10(单例模式)
单例模式 单例模式(Singleton) : 又被称为单体模式,是只允许实例化一次的对象类.一个类有且仅有一个实例,并且自行实例化向整个系统提供. 命名空间 单例模式可能是JavaScript中我们最 ...
- JavaScript的学习--JavaScript设计模式的总结
这篇博客只是自己对设计模式的理解的备忘~ 看完了<JavaScript设计模式>这本书,一直没有写博客记录一下,最近抽出时间来重读了一下,就顺便记录一下~ 如果你只是想粗略了解一下Java ...
- [JavaScript设计模式]惰性单例模式
惰性单例模式 之前介绍了JS中类的单例模式,这次我们讨论下单例模式的应用.在众多网站中,登录框的实现方式就是一个单例,点击一次就展示一次,所以我们可以在页面加载好的时候就创建一个登录框,点击页面上的登 ...
- JavaScript设计模式_01_单例模式
最近项目不太忙,难得有时间看看书,平时挺喜欢js这门语言.也看过很多高级教程,觉得自己还是比较热衷于js的设计模式.这一次重温一下<JavaScript设计模式与开发实践>,开篇为单例模式 ...
- 为什么学习JavaScript设计模式,因为它是核心
那么什么是设计模式呢?当我们在玩游戏的时候,我们会去追求如何最快地通过,去追求获得已什么高效率的操作获得最好的奖品:下班回家,我们打开手机app查询最便捷的路线去坐车:叫外卖时候,也会找附近最近又实惠 ...
- JavaScript设计模式,单例模式!
单例设计模式:保证一个类仅有一个实例,并且提供一个访问它的全局访问点.有些对象只需要一个,这时可用单例模式. 传统的单例模式 和new 创建对象的调用不一样 调用者要调用xxx.getInstance ...
- 第一章 --- 关于Javascript 设计模式 之 单例模式
首先我们对单例模式先进行理论上的讲解,接下来,我们再通过具体的代码示例,来讲解,这个单例模式的使用场景和这种模式的优缺点 (这个系列的所有关于设计模式的都是面向Javascript) 一.理论定义: ...
- JavaScript设计模式之单例模式
一.单例模式概念 单例就是保证一个类只有一个实例,实现方法一般是先判断实例存在与否,如果存在直接返回,如果不存在就创建了再返回,这就确保了一个类只有一个实例对象.在JavaScript里,单例作为一个 ...
随机推荐
- ajax的序列化表单提交
通过传统的 form 表单提交的方式上传文件 ? 1 2 3 4 <form id="uploadForm" action="" method=" ...
- SpringBoot引入监听器
方法一: 实现ServletContextListener ,并添加@WebListener注解 因为ServletContextListener 是由servlet容器管理,游离于spring容器之 ...
- vue组件:canvas实现图片涂鸦功能
方案背景 需求 需要对图片进行标注,导出图片. 需要标注N多图片最后同时保存. 需要根据多边形区域数据(区域.颜色.名称)标注. 对应方案 用canvas实现涂鸦.圆形.矩形的绘制,最终生成图片bas ...
- Verilog之语句位置
1.if语句.case语句必须放在always过程语句块中. 2.verilog的系统函数比如:\(display/\)monitor必须放在initial 过程语句块中.这点尚为理解为何,但必须这样 ...
- 【windows】共享文件夹设置
控制面板\网络和 Internet\网络和共享中心\高级共享设置 在当前的域\公用\家庭网络 下文件和打印机共享开关打开 现在可以在 计算机-网络 里面看到共享的计算机啦 选中自己想要分享的文件,右键 ...
- Python函数的基本定义和调用以及内置函数
首先我们要了解Python函数的基本定义: 函数是什么? 函数是可以实现一些特定功能的小方法或是小程序.在Python中有很多内建函数,当然随着学习的深入,你也可以学会创建对自己有用的函数.简单的理解 ...
- LeetCode(23)Merge k Sorted Lists
题目 Merge k sorted linked lists and return it as one sorted list. Analyze and describe its complexity ...
- CRC点滴
研究了一个晚上,大致看懂了crc校验的方法.这里记录一下,因为can总线中需要用到crc校验的. 举例说明CRC校验码的求法:(此例子摘自百度百科:CRC校验码) 信息字段代码为: 1011001:对 ...
- c#利用反射实现对类中的常量进行取值和对应常量的注释
C#利用反射实现对类中的常量进行取值和对应常量的注释 项目示例:https://gitee.com/dhclly/IceDog.GenerateErrorCode 因为业务需要,项目中有大量的错误码, ...
- [POJ 1005] I Think I Need a Houseboat C++解题
I Think I Need a Houseboat Time Limit: 1000MS Memory Limit: 10000K Total Submissions: 81874 ...