4. JS设计模式与开发实践摘录（二）

1.单例模式

• 单例模式的定义是：保证一个类仅有一个实例，并提供一个访问它的全局访问点。
• 单例模式是一种常用的模式，有一些对象我们往往只需要一个，比如线程池、全局缓存、浏览器中的window 对象等。

//缓存代理
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 );
};

//接下来引入代理类proxySingletonCreateDiv：
var ProxySingletonCreateDiv = (function(){
  var instance;
  return function( html ){
    if ( !instance ){
       instance = new CreateDiv( html );
    }
    return instance;
   }
})();
var a = new ProxySingletonCreateDiv( 'sven1' );
var b = new ProxySingletonCreateDiv( 'sven2' );
alert ( a === b );

减少全局变量使用的方式

1. 使用命名空间

var MyApp = {
  event: {},
  dom: {
    style: {}
  }
};

2. 使用闭包封装私有变量

// 这种方法把一些变量封装在闭包的内部，只暴露一些接口跟外界通信：
var user = (function(){
   var __name = 'sven',
   __age = 29;
   return {
     getUserInfo: function(){
       return __name + '-' + __age;
     }
   }
})();
//我们用下划线来约定私有变量__name 和__age，它们被封装在闭包产生的作用域中，外部是访问不到这两个变量的，这就避免了对全局的命令污染。

惰性单例

• instance 实例对象总是在我们调用Singleton.getInstance 的时候才被创建，而不是在页面加载好的时候就创建

// 就把如何管理单例的逻辑从原来的代码中抽离出来，这些逻辑被封装在getSingle函数内部，创建对象的方法fn 被当成参数动态传入getSingle 函数
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';
};

2.策略模式

• 定义一系列的算法，把它们一个个封装起来，并且使它们可以相互替换。

3.代理模式

• 代理模式是为一个对象提供一个代用品或占位符，以便控制对它的访问。
• 代理模式的关键是，当客户不方便直接访问一个对象或者不满足需要的时候，提供一个替身对象来控制对这个对象的访问，客户实际上访问的是替身对象。替身对象对请求做出一些处理之后，再把请求转交给本体对象