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设计模式与开发实践》读书笔记之单例模式的更多相关文章

  1. JavaScript设计模式与开发实践——读书笔记1.高阶函数(上)

    说来惭愧,4个多月未更新了.4月份以后就开始忙起来了,论文.毕设.毕业旅行等七七八八的事情占据了很多时间,毕业之后开始忙碌的工作,这期间一直想写博客,但是一直没能静下心写.这段时间在看<Java ...

  2. JavaScript设计模式与开发实践——读书笔记1.高阶函数(下)

    上部分主要介绍高阶函数的常见形式,本部分将着重介绍高阶函数的高级应用. 1.currying currying指的是函数柯里化,又称部分求值.一个currying的函数会先接受一些参数,但不立即求值, ...

  3. Javascript设计模式与开发实践读书笔记（1-3章）

    第一章 面向对象的Javascript 1.1 多态在面向对象设计中的应用   多态最根本好处在于,你不必询问对象“你是什么类型”而后根据得到的答案调用对象的某个行为--你只管调用行为就好,剩下的一切 ...

  4. javascript设计模式与开发实践阅读笔记（8）——观察者模式

    发布-订阅模式,也叫观察者模式:定义对象间的一种一对多的依赖关系,当一个对象的状态发生改变时,所有依赖于它的对象都将得到通知. 在JavaScript开发中,我们一般用事件模型来替代传统的观察者模式. ...

  5. javascript设计模式与开发实践阅读笔记（7）——迭代器模式

    迭代器模式:指提供一种方法顺序访问一个聚合对象中的各个元素,而又不需要暴露该对象的内部表示. 迭代器模式可以把迭代的过程从业务逻辑中分离出来,在使用迭代器模式之后,即使不关心对象的内部构造,也可以按顺 ...

  6. javascript设计模式与开发实践阅读笔记（6）——代理模式

    代理模式:是为一个对象提供一个代用品或占位符,以便控制对它的访问. 代理模式的关键是,当客户不方便直接访问一个对象或者不满足需要的时候,提供一个替身对象来控制对这个对象的访问,客户实际上访问的是替身对 ...

  7. javascript设计模式与开发实践阅读笔记（4）——单例模式

    定义 单例模式:保证一个类仅有一个实例,并提供一个访问它的全局访问点. 具体来说,就是保证有些对象有且只有一个,比如线程池.全局缓存.浏览器中的window 对象等.在js中单例模式用途很广,比如登录 ...

  8. 《JavaScript设计模式与开发实践》笔记第八章 发布-订阅模式

    第八章 发布-订阅模式 发布-订阅模式描述 发布-订阅模式又叫观察者模式,它定义对象间的一种一对多的依赖关系,当一个对象的状态发生改变时,所有依赖于它的对象都将得到通知. 发布-订阅模式可以广泛应用于 ...

  9. 《JavaScript设计模式与开发实践》笔记第一章

    第一章 面向对象的JavaScript 动态类型语言和鸭子类型 编程语言按照数据类型大体可以分为两类:静态类型语言.动态类型语言. 静态类型语言:在编译时便已确定变量的类型. 优点: 在编译时就能发现 ...

  10. javascript设计模式与开发实践阅读笔记（5）——策略模式

    策略模式:定义一系列的算法,把它们一个个封装起来,并且使它们可以相互替换. 我的理解就是把各种方法封装成函数,同时存在一个可以调用这些方法的公共函数.这样做的好处是可以消化掉内部的分支判断,使代码效率 ...

随机推荐

  1. Selenium HtmlUnitDriver 多浏览器的支持

    1.HtmlUnitDriver WebDriver包括一个基于HtmlUnit的无界面实现,称为HtmlUnitDriver,即使用HtmlUnit时并不会打开真实的浏览器,而是在内存中执行代码,因 ...

  2. eval 捕获dbi错误

    [root@dr-mysql01 ~]# cat t2.pl use DBI; my $dbUser='zabbix'; my $user="root"; my $passwd=& ...

  3. vc2010下使用64位控件

    最近把我的控件(ST_Curve www.st-curve.cn)升级到了64位,2010编译,本来以为很简单的问题,结果折腾了两天(也有可能我多年没做过界面和vc相关的东西了吧),于是把我遇到的问题 ...

  4. display:table 水平居中

    <div style="width:auto; margin:auto;display:table"> <div style="width: 100px ...

  5. 【IACV】边缘检测技术传统的方法与理论

    1.边缘检测的目的 边缘检测是图像分析中使用到的最常见的操作之一,而且相比其他任何主题来说,文献中提到的与边缘增强(edge enhancement)[1]与边缘检测(edge detection)[ ...

  6. 菜鸟从零学编程（七）——搭建一个完整的Java开发环境

    作为一个Java程序员,配置一个java开发环境是必备的技能,今天给广大菜鸟初学者补上一课.环境的配置,大概就分三个1,JDK 2,Tomcat(或者其他的)3,eclipse(或者myeclipse ...

  7. 在MFC程序中使用XML文件配置工具栏

    现在我发现使用Visual Studio的资源编辑器进行编辑资源有着诸多的不便:首先是任何资源的变动一般变动代码,不利于系统维护,其次Visual Studio的资源编辑器的本身的功能有限,也不利于界 ...

  8. BCB/Delphi中常用的VCL函数说明（文件函数）

    --------------------文件操作--------------------函数名称:ChangeFileExt函数说明:更改指定文件的扩展名,函数原型如下:AnsiString __fa ...

  9. java中文排序问题(转)

    在Java中,对一个数组或列表(在本文中统称为集合)中的元素排序,是一个很经常的事情.好在Sun公司在Java库中实现了大部分功能.如果集合中的元素实现了Comparable接口,调用以下的静态(st ...

  10. Suse 创建NFS共享目录

    Suse 创建NFS共享目录 服务端的配置: 1.编辑nfs服务的配置文件 /software/suse11 *(rw,sync,no_root_squash,no_all_squash) 凝视: / ...