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: {}
  }
};
  1. 使用闭包封装私有变量
// 这种方法把一些变量封装在闭包的内部,只暴露一些接口跟外界通信:
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.代理模式
  • 代理模式是为一个对象提供一个代用品或占位符,以便控制对它的访问。
  • 代理模式的关键是,当客户不方便直接访问一个对象或者不满足需要的时候,提供一个替身对象来控制对这个对象的访问,客户实际上访问的是替身对象。替身对象对请求做出一些处理之后,再把请求转交给本体对象

你可能感兴趣的:(4. JS设计模式与开发实践摘录(二))