4-JavaScript設計模式——單體

1、單體分類：

簡單單體、閉包單體、惰性單體、分支單體。

2、代碼實例：

1、簡單單體

var Singleton = {};// 最簡單的單體

// 給單體添加屬性和方法
var J = {
  name : '張三',
  age : 18,
  study : function(){
    alert(this.name + '正在學習...');
  }
};

J.study(); // 張三正在學習...

// 單體可用於劃分命名空間（常用）
var J = {};

J.sayHello = function(){
  alert('Hello world!');
};

2、閉包單體

// 閉包的主要目的是 保護數據
// 創建閉包單體
var J = {};// 創建命名空間J

J.Singleton = (function(){
  
  // 閉包的主要目的：添加自己的私有成員，外部無法訪問
  var a1 = 'red';
  var a2 = 666;
  var f1 = function(){
    alert('我是方法1');
  };
  var f2 = function(){
    alert('我是方法2');
  };
  
  // 把塊級作用域的執行結果直接賦值給單體對象
  return {
    color : a1,
    size : a2,
    method1 : function(){
      return f1();
    },
    method2 : function(){
      return f2();
    }
  };
})();

alert(J.Singleton.color); // red
J.Singleton.method1(); // 我是方法1

3、惰性單體

// 惰性單體（和閉包單體有一些相似之處）
// 命名空間
var J = {};

J.Singleton = (function(){
  // 利用私有變量 控制返回的單體對象
  var uniqInstance; // undefined
  
  // 需要一個構造器 init 初始化單體對象的方法
  function init() {
    // 私有成員變量
    var a1 = 10;
    var a2 = true;
    var fn1 = function(){alert('fn1');};
    var fn2 = function(){alert('fn2');};
    
    return {
      attr1 : a1,
      attr2 : a2,
      method1 : function(){alert('fn1');},
      method2 : function(){alert('fn2');}
    };
  }
  
  return {
    getInstance : function(){
      if(!uniqInstance){ // 如果不存在，創建單體實例
        uniqInstance = init();
      }
      return uniqInstance;
    }
  };
})();

var obj = J.Singleton.getInstance();
alert(obj.attr1); // 10
obj.method1(); // fn1

4、分支單體

// 分支單體 （判斷程序的分支《多用於瀏覽器差異的檢測》）
var J = {}; // 命名空間

var def = true; // true代表火狐，false代表IE

J.More = (function(){
  var objA = { // 火狐瀏覽器 內部的一些配置
    attr1 : '我是火狐瀏覽器'
  };
  var objB = { // IE瀏覽器 內部的一些配置
    attr1 : '我是IE瀏覽器'
  };
  return def ? objA : objB;
})();

alert(J.More.attr1); // 我是火狐瀏覽器