标签：
单例模式是一种常用的模式，有一些对象我们往往只需要一个，比如全局缓存，window对象。单例模式在js开发中单例模式的用途非常广泛，比如页面中有一个登录浮窗，无论单击多少次登录窗口，这个窗口只会创建一次，那么这个窗口就适合用单例模式来创建。
1、单例模式实例：
要实现单例模式并不复杂，无非是用一个变量来标志当前是否已经为某个类创建过对象，如果是，则在下一次取该类实例的时候，之间返回之前创建的对象。
1 var Sign=function(name){ 2 this.name=name; 3 this.instance=null; 4 } 5 6 Sign.prototype.getName=function(){ 7 return this.name; 8 } 9 10 Sign.getInstance=function(name){ 11 if(!this.instance){ 12 this.instance=new Sign(name); 13 } 14 return this.instance; 15 } 16 17 var obj1=Sign.getInstance("gao"); 18 var obj2=Sign.getInstance("xiang"); 19 alert(obj1===obj2); //true
2.用代理实现单例模式。
我们可以把负责管理单例的逻辑转移到代理类Signleton中。
1 var createDiv=function(html){ 2 this.html=html; 3 this.init(); 4 } 5 6 createDiv.prototype.init=function(){ 7 var div=document.createElement("div"); 8 document.innerHTML=this.html; 9 document.body.appendChild(div); 10 } 11 12 var Signleton=(function(){ 13 var instance; 14 return function(html){ 15 if(!instance){ 16 instance=new createDiv(html); 17 } 18 return instance; 19 } 20 })(); 21 22 var obj1=new Signleton("h1"); 23 var obj2=new Signleton("h2"); 24 alert(obj1===obj2) //true
这样写的好处显而易见，复用性强。
3.惰性单例
什么是惰性单例，就是指在需要的时候在实现单例，比如在点击登录按钮的时候再创建登录浮窗。而不是页面已加载就已经创建好登录浮窗，因为有些用户并不需要登录，而只是看看天气，看看新闻。
1 var createLogin=(function(){ 2 var div; 3 return function(){ 4 if(!div){ 5 div=document.createElement(‘div‘); 6 div.innerHTML=‘登录窗口‘; 7 div.style.display=‘none‘; 8 document.body.appendChild(div); 9 } 10 return div; 11 } 12 })(); 13 14 document.getElementById(‘loginBtn‘).addEventListener(‘click‘,function(){ 15 var loginWindow=createLogin(); 16 loginWindow.style.display=‘block‘; 17 },false);
4.通用惰性单例。
上一段代码违反了单一职责原则，如果有一天我们并不是createDiv，而是createFrame，createScript时就必须改动源代码了。我们需要把不变的部分隔离出来。实现一个通用的函数。
这个逻辑始终是一样的。
1 var obj; 2 if(!obj){ 3 obj=xxx; 4 }
现在封装一个getSignle函数。
var getSignle=function(fn){ var result; return function(){ return result||(result=fn.apply(this,arguments)) } };
创建对象的方法fn被当场参数传入getSignle函数中，之后让getSignle返回一个函数，resule标志对象是否被创建，如果没创建，result保存fn的执行结果，由于result存放在闭包环境中，所以不会被销毁，在下次请求时，直接返回已经存在的result。
1 var createLoginDiv=function(){ 2 var div=document.createElement("div"); 3 div.innerHTML="我是登录窗口"; 4 div.style.display=‘none‘; 5 document.body.appendChild(div); 6 return div; 7 } 8 9 var divLayout=getSignle(createLoginDiv); 10 11 document.getElementById("loginBtn").addEventListener(‘click‘,function(){ 12 var loginWindow=divLayout(); 13 loginWindow.style.display=‘block‘; 14 },false);
标签：
原文地址：http://www.cnblogs.com/smartXiang/p/5911041.html
