最近项目不太忙,难得有时间看看书,平时挺喜欢js这门语言。也看过很多高级教程,觉得自己还是比较热衷于js的设计模式。这一次重温一下《JavaScript设计模式与开发实践》,开篇为单例模式。

/**
* pre 单例模式
* 定义:保证一个类仅有一个实例,并提供一个访问它的全局访问点
* 应用:单例模式是一种常用的模式,有一些对象我们往往只需要一个,
* 比如线程池、全局缓存、浏览器中的 window 对象等。
*/
//--------------singleton-01-------------
/*写法1*/
var Singleton = function(name){
this.name = name;
this.instance = null;
}; Singleton.prototype.getName = function(){
alert(this.name);
}; Singleton.getInstance = function(){
if(!this.instance){
this.instance = new Singleton(name);
}
return this.instance;
}; var a = Singleton.getInstance("amy");
var b = Singleton.getInstance("ben");
alert(a === b); // ------------singleton-02----------------
/*写法2*/
var Singleton = function(name){
this.name = name;
}
Singleton.prototype.getName = function(){
return this.name;
} Singleton.getInstance = (function(){
var instance = null;
return function(name){
if(!instance){
instance = new Singleton(name);
}
return instance;
}
})(); var a = Singleton.getInstance("amy");
var b = Singleton.getInstance("ben");
alert(a === b); // ------------singleton03-----------
/*写法3*/
var Singleton = (function(){
var instance;
return function(name){
if(instance){
return instance;
}
this.name = name;
instance = this;
}
})();
var a = new Singleton("amy");
var b = new Singleton("ben");
alert(a === b); //---------------- 示例 ---------------
var getSingleton = function(fn) {
var result;
return function() {
if(!result) {
result = fn.apply(this, arguments);
}
return result;
}
}; var getSingletonVip = (function() {
var instance;
return function(fn) {
return instance || (instance = fn.apply(this, arguments));
}
})(); var createLoginUser = function() {
var div = document.createElement("div");
div.innerHTML = '这是登录框';
document.body.appendChild(div);
return div;
}; var createInfoGrid = function() {
var div = document.createElement("div");
div.innerHTML = '这是列表信息框';
document.body.appendChild(div);
return div;
};
//--执行getSingleton
var createUserDiv = getSingleton(createLoginUser);
createUserDiv();
createUserDiv(); //--执行getSingletonVip
getSingletonVip(createLoginUser);
getSingletonVip(createLoginUser);
本文版权归作者和博客园共有,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文链接,否则保留追究法律责任的权利。

JavaScript设计模式_01_单例模式的更多相关文章

  1. JavaScript设计模式之单例模式【惰性单例】

    在提高开发水平,往中高级前端工程师中,利用设计模式是必不可少的一条道路.掌握设计模式的思想远远比硬套重要,因为设计模式是一种思想,不局限于开发语言.但实际上由于语言的特性不同,往往在实现的时候会有不少 ...

  2. 再起航,我的学习笔记之JavaScript设计模式10(单例模式)

    单例模式 单例模式(Singleton) : 又被称为单体模式,是只允许实例化一次的对象类.一个类有且仅有一个实例,并且自行实例化向整个系统提供. 命名空间 单例模式可能是JavaScript中我们最 ...

  3. [JavaScript设计模式]惰性单例模式

    惰性单例模式 之前介绍了JS中类的单例模式,这次我们讨论下单例模式的应用.在众多网站中,登录框的实现方式就是一个单例,点击一次就展示一次,所以我们可以在页面加载好的时候就创建一个登录框,点击页面上的登 ...

  4. JavaScript设计模式,单例模式!

    单例设计模式:保证一个类仅有一个实例,并且提供一个访问它的全局访问点.有些对象只需要一个,这时可用单例模式. 传统的单例模式 和new 创建对象的调用不一样 调用者要调用xxx.getInstance ...

  5. 第一章 --- 关于Javascript 设计模式 之 单例模式

    首先我们对单例模式先进行理论上的讲解,接下来,我们再通过具体的代码示例,来讲解,这个单例模式的使用场景和这种模式的优缺点 (这个系列的所有关于设计模式的都是面向Javascript) 一.理论定义: ...

  6. JavaScript设计模式之单例模式

    一.单例模式概念 单例就是保证一个类只有一个实例,实现方法一般是先判断实例存在与否,如果存在直接返回,如果不存在就创建了再返回,这就确保了一个类只有一个实例对象.在JavaScript里,单例作为一个 ...

  7. 「设计模式」JavaScript - 设计模式之单例模式与场景实践

    单例介绍 上次总结了设计模式中的module模式,可能没有真真正正的使用在场景中,发现效果并不好,想要使用起来却不那么得心应手, 所以这次我打算换一种方式~~从简单的场景中来看单例模式, 因为Java ...

  8. JavaScript 设计模式之单例模式

    一.单例模式概念解读 1.单例模式概念文字解读 单例就是保证一个类只有一个实例,实现的方法一般是先判断实例存在与否,如果存在直接返回,如果不存在就创建了再返回,这就确保了一个类只有一个实例对象.在Ja ...

  9. JavaScript设计模式-7.单例模式

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

随机推荐

  1. python基本数据类型——int

    一.int的范围 python2: 在32位机器上,整数的位数为32位,取值范围为-2**31-2**31-1: 在64位系统上,整数的位数为64位,取值范围为-2**63-2**63-1: pyth ...

  2. extern用法详解

    1 基本解释 extern可以置于变量或者函数前,以标示变量或者函数的定义在别的文件中,提示编译器遇到此变量和函数时在其他模块中寻找其定义. 另外,extern也可用来进行链接指定. 2 问题:ext ...

  3. HTC开放Vive Tracker代码啦!

    (52VR网2017年5月2日)HTC正在为工作室创建的Vive Tracker项目发布教程和项目文件,作为VR开发人员的新资源. 该公司希望能够让更多的开发者能够在开发Vive VR耳机时制作自己的 ...

  4. String转int数字格式异常问题

     写在前面的话 差不多一年前就计划写博客,可因为种种原因一直没有写,反而我身边的一些同学在我建议他们写博客不久之后就写了,比如张博同学,基本每次总结一个知识点就写一篇,这样不但方便自己以后查看翻阅,也 ...

  5. 1018 Big Number

    Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 65536/32768 K (Java/Others)Total Submission( ...

  6. 解析Excel文件并把数据存入数据库

    前段时间做一个小项目,为了同时存储多条数据,其中有一个功能是解析Excel并把其中的数据存入对应数据库中.花了两天时间,不过一天多是因为用了"upload"关键字作为URL从而导致 ...

  7. Java学习笔记——设计模式之三.装饰模式

    函数应该做一件事,做好这件事,只做这一件事. --Clean Code 装饰模式,上代码: 先定义零件类: package cn.no3.decorator.template; public abst ...

  8. 非阻塞式线程安全列表-ConcurrentLinkedDeque

    一.ConcurrentLinkedDeque public class ConcurrentLinkedDeque<E> extends AbstractCollection<E& ...

  9. Spark操作HBase问题:java.io.IOException: Non-increasing Bloom keys

    1 问题描述 在使用Spark BulkLoad数据到HBase时遇到以下问题: 17/05/19 14:47:26 WARN scheduler.TaskSetManager: Lost task ...

  10. 使用Fiddler进行http抓包和调试

    本文目录 : Fiddler的工作原理 Fiddler的常用操作 支持https解密分析 Fiddler的断点调试 本文小结 参考文献 俗话说:工欲善其事,必先利其器. Fiddler是windows ...