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); // 我是火狐浏览器



發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章