javaScript設計模式與開發實踐（一）單例模式

標籤：body   function   display   代理   匿名函數   innerhtml   turn   onclick   使用   

 

單例模式定義：保證一個類僅有有一個執行個體，並提供一個訪問它的全域訪問點。

應用情境：有一些對象只需要一個。如線程池、全域緩衝、瀏覽器中的window對象等。

 

實現一：

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(‘sven‘);

 實現一的缺點：增加了這個“類”的不透明性，使用者必須知道這是一個單例類，跟以往通過new的方式擷取對象不同。

 

實現二：

var CreateDiv = (function(){  var instance;  var CreateDiv = function(html) {    if(instance)      return instance;    this.html = html;    this.init();    return instance = this;  };  CreateDiv.prototype.init = function(){    var div = document.createElement(‘div‘);    div.innerHTML = this.html;    document.body.appendChild(div);  };  return CreateDiv;})();var a = new CreateDiv(‘sven‘);

 實現二的缺點：使用了自執行的匿名函數和閉包，並讓匿名函數返回了真正的Singleton構造方法，增加了程式複雜度。

 

實現三：用代理實現單例模式

  var CreateDiv = function(html) {    this.html = html;    this.init();  };  CreateDiv.prototype.init = function(){    var div = document.createElement(‘div‘);    div.innerHTML = this.html;    document.body.appendChild(div);  };  var ProxySingletonCreateDiv = (function(){        var instance;    return function(html) {      if(!instance) {        instance = new CreateDiv(html);      }         return instance;    };  })();  var a = new ProxySingletonCreateDiv(‘sven‘);

 實現三將負責管理單例的邏輯移到了代理類中。這樣一來，將CreateDiv和ProxySingletonCreateDiv組合起來就可實現單例模式。

 

實現四：惰性單例（需要時才建立對象執行個體） 重點

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‘;};

 

javaScript設計模式與開發實踐（一）單例模式