《JavaScript设计模式与开发实践》读书笔记之单例模式
1、单例模式
保证一个类仅有一个实例，并提供一个访问它的全局访问点
1.1 传统的单例模式
var Singleton=function(name){
this.name=name;
}
Singleton.prototype.getName=function(){
alert(this.name);
}
Singleton.getInstance=(function(){
var instance=null;
return function (name) {
if(!instance){
instance=new Singleton(name);
}
return instance;
}
})();
var a=Singleton.getInstance('sven1');
var b=Singleton.getInstance('sven2');
alert(a===b);//true
1.2 JavaScript中的单例模式
单例模式的核心是确保只有一个实例，并提供全局访问
JavaScript中，可以把全局变量当成单例来使用
var a={};
以这种方式创建对象a，这个对象a是独一无二的，并且在全局作用域可以被访问
全局变量容易造成命名空间污染，使用命名空间可以减少全局变量的数量
var namespace1={
a:function(){
alert(1);
},
b:function(){
alert(2);
}
};
1.3 应用举例--惰性单例
以点击“登陆”按钮弹出登陆框为例
<html>
<body>
<button id="loginBtn" >登陆</button>
</body>
<script>
var createLoginLayer=(function(){
var div;
return function(){
if(!div){
div=document.createElement('div');
div.innerHTML='我是登陆浮窗';
div.style.display='none';
document.body.appendChild(div);
}
return div;
}
})();
document.getElementById('loginBtn').onclick=function(){
var loginLayer=createLoginLayer();
loginLayer.style.display='block';
};
</script>
</html>
上述示例违反了单一职责原则，创建对象和管理单例逻辑耦合在一起了
var getSingle= function (fn) {
var result;
return function () {
return result || (result = fn.apply(this,arguments));
}
};
var createLoginLayer=function(){
var div=document.createElement('div');
div.innerHTML='我是登陆符窗';
div.style.display='none';
document.body.appendChild(div);
return div;
};
var createSingleLoginLayer=getSingle(createLoginLayer());
document.getElementById('loginBtn').onclick=function(){
var loginLayer=createSingleLoginLayer();
loginLayer.style.display='block';
};
//当需要创建唯一的iframe用于动态加载第三方页面时
var createSingleIframe=getSingle(function () {
var iframe=document.createElement('iframe');
document.body.appendChild(iframe);
});
document.getElementById('loginBtn').onclick=function(){
var loginLayer=createSingleIframe();
loginLayer.src='http://www.google.com';
};
《JavaScript设计模式与开发实践》读书笔记之单例模式的更多相关文章
- JavaScript设计模式与开发实践——读书笔记1.高阶函数(上)
说来惭愧,4个多月未更新了.4月份以后就开始忙起来了,论文.毕设.毕业旅行等七七八八的事情占据了很多时间,毕业之后开始忙碌的工作,这期间一直想写博客,但是一直没能静下心写.这段时间在看<Java ...
- JavaScript设计模式与开发实践——读书笔记1.高阶函数(下)
上部分主要介绍高阶函数的常见形式,本部分将着重介绍高阶函数的高级应用. 1.currying currying指的是函数柯里化,又称部分求值.一个currying的函数会先接受一些参数,但不立即求值, ...
- Javascript设计模式与开发实践读书笔记（1-3章）
第一章 面向对象的Javascript 1.1 多态在面向对象设计中的应用 多态最根本好处在于,你不必询问对象“你是什么类型”而后根据得到的答案调用对象的某个行为--你只管调用行为就好,剩下的一切 ...
- javascript设计模式与开发实践阅读笔记（8）——观察者模式
发布-订阅模式,也叫观察者模式:定义对象间的一种一对多的依赖关系,当一个对象的状态发生改变时,所有依赖于它的对象都将得到通知. 在JavaScript开发中,我们一般用事件模型来替代传统的观察者模式. ...
- javascript设计模式与开发实践阅读笔记（7）——迭代器模式
迭代器模式:指提供一种方法顺序访问一个聚合对象中的各个元素,而又不需要暴露该对象的内部表示. 迭代器模式可以把迭代的过程从业务逻辑中分离出来,在使用迭代器模式之后,即使不关心对象的内部构造,也可以按顺 ...
- javascript设计模式与开发实践阅读笔记（6）——代理模式
代理模式:是为一个对象提供一个代用品或占位符,以便控制对它的访问. 代理模式的关键是,当客户不方便直接访问一个对象或者不满足需要的时候,提供一个替身对象来控制对这个对象的访问,客户实际上访问的是替身对 ...
- javascript设计模式与开发实践阅读笔记（4）——单例模式
定义 单例模式:保证一个类仅有一个实例,并提供一个访问它的全局访问点. 具体来说,就是保证有些对象有且只有一个,比如线程池.全局缓存.浏览器中的window 对象等.在js中单例模式用途很广,比如登录 ...
- 《JavaScript设计模式与开发实践》笔记第八章 发布-订阅模式
第八章 发布-订阅模式 发布-订阅模式描述 发布-订阅模式又叫观察者模式,它定义对象间的一种一对多的依赖关系,当一个对象的状态发生改变时,所有依赖于它的对象都将得到通知. 发布-订阅模式可以广泛应用于 ...
- 《JavaScript设计模式与开发实践》笔记第一章
第一章 面向对象的JavaScript 动态类型语言和鸭子类型 编程语言按照数据类型大体可以分为两类:静态类型语言.动态类型语言. 静态类型语言:在编译时便已确定变量的类型. 优点: 在编译时就能发现 ...
- javascript设计模式与开发实践阅读笔记（5）——策略模式
策略模式:定义一系列的算法,把它们一个个封装起来,并且使它们可以相互替换. 我的理解就是把各种方法封装成函数,同时存在一个可以调用这些方法的公共函数.这样做的好处是可以消化掉内部的分支判断,使代码效率 ...
随机推荐
- JDK 安装以及环境变量的配置（Windows）
首先下载对应版本的jdk ,然后安装,这里使用的是jdk 1.7的安装的 这个时候,JDK 已经安装完成,打开cmd 输入 java -version 就可以查看到,当前JDK 的版本如图 JDK 安 ...
- sqlserver存储过程学习笔记（一）基础知识篇(全)
说出来有点丢人,做sqlserver应用系统近一年,竟然没有使用过存储过程,现在就好好的梳理一下对应知识,慢慢让其加入到我的项目中去吧. 存储过程的优点:1.运行效率高,提供了在服务器端快速执行sql ...
- Eclipse背景和匹配出现单词的一些设置
Eclipse的背景色和关键词的设置这里就不多说了,只说明设置路径: 背景色:[Window]--->[Preference]-->[General]--->[Editors]--- ...
- Windows环境下访问NFS（33篇Storage的文章）
Windows环境下访问NFS 使用Solaris时,如果想在两台Solaris之间共享数据,那么你想到的最省事.最方便的方法肯定是nfs.但是现在的学生们的桌面,估计99%以上都是Windows,W ...
- Git 图解剖析(转)
git中文件内容并没有真正存储在索引(.git/index)或者提交对象中,而是以blob的形式分别存储在数据库中(.git/objects),并用SHA-1值来校验. 索引文件用识别码列出相关的bl ...
- 配置虚拟主机并更改Apache默认解析路径
配置虚拟主机,非常easy 改动以下文件: 加入以下几句话 <VirtualHost *:80> ##ServerAdmin webmaster@dummy-host2.example.c ...
- JNI生成so
软件:android-ndk-r8 推荐使用这个版本,可以直接不用安装Cygwin软件就可以编译. 然后在系统环境变量中path选项中添加安装路径,比如我的:C:\android-ndk-r8: 然后 ...
- map size mismatch; abort
数据库启动时有莫名的提示map size mismatch; abort 原帖在这里:http://t.askmaclean.com/thread-1397-1-1.html 今天帮网友(centos ...
- 沙朗javascript总结一下（一）---基础知识
我也听说过Javascript这东西.我一直感觉很神奇,但它并没有去太懂.今天,牛腩哥哥随后的初步研究,一些浅显的认识.就先总结一下. 首先,什么是javascript? javascript是一种直 ...
- thinkphp3.2
1.安装WAMPServer,到D:\wamp\. 2.下载ThinkPHP3.2.2核心版.解压缩后,放到D:\wamp\www\MyWeb\.打开浏览器,输入网址:http://localhost ...