js design pattern - singleton

Singleton

To ensure that a class has only one instance and provide a global access point to access it.

Singleton pattern is a common pattern, there are some objects that we tend to need only one such thread pool, global cache, the browser window objects.

Singleton pattern in JavaScript

1. Using namespaces

In JavaScript, there is achieved a single example of a wide variety of ways, the simplest way is to use the object in a literal way, which can contain a literal large number of properties and methods:

let people = {
  name: "Jack",
  age: 18,
  play() {
    console.log('i like game');
  }
}

You can also dynamically create a namespace

// 定义对象
var MyApp = {};
// 对象的方法
MyApp.namespace = function( name ){
  // 将参数分割成数组
  var parts = name.split( '.' );
  // 定义变量
  var current = MyApp;
  // 创建对象里面的属性
  for ( var i in parts ){
    if ( !current[ parts[ i ] ] ){
      current[ parts[ i ] ] = {};
    }
    current = current[ parts[ i ] ];
  }
};
MyApp.namespace( 'event' );
MyApp.namespace( 'dom.style' );

/******************* 上面没看懂没关系 ***********************/
// 上述代码等价于
var MyApp = {
  event: {},
  dom: {
    style: {}
  } 
};

2. closure package private variables

var user = (function(){ 
  var __name = 'sven', 
  __age = 29; 
  return { 
    getUserInfo: function(){ 
      return __name + '-' + __age; 
    } 
  } 
})();

We agreed to underscore private variables __nameand __agethey are encapsulated in scope closures generated external access is less than two variables, which avoids the command of global pollution.


Example achieve a standard single mode

var Singleton = function( name ){
  this.name = name;
  this.instance = null;
};
Singleton.prototype.getName = function(){
  alert ( this.name );
};
Singleton.getInstance = function( name ){
  if ( !this.instance ){
    this.instance = new Singleton( name );
  }
  return this.instance;
};
var a = Singleton.getInstance( 'sven1' );
var b = Singleton.getInstance( 'sven2' );
alert ( a === b ); // true

We Singleton.getInstanceused to get Singletona unique object class, this approach is relatively simple, but there is a problem, is the addition of "opacity" of the class, Singletonuser class must know that this is a singleton class, with the past by new XXXthe way to get different objects, where we seek to use Singleton.getInstanceto get the object.

Transparent singleton

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( 'sven1' );
var b = new CreateDiv( 'sven2' );
alert ( a === b ); // true

In order to put instancethe package together, we use the anonymous functions and closures self-executing, and let this anonymous function returns
true Singletonconstructor, which increases the complexity of some programs

3. Agent with a single-mode embodiment

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 );

By way of introducing the proxy class, we also completed the preparation of a singleton pattern, with before the difference is, now we have
the logic responsible for managing single example of a proxy class moved proxySingletonCreateDivin. Thus, CreateDivit becomes an ordinary class, with its proxySingletonCreateDivcombined embodiment can achieve the effect of a single mode.

Inert singleton

Inert single case refers only to create an object instance when needed.

var Singleton = (function () {
  var instantiated;
  function init() {
    /*这里定义单例代码*/
    return {
      publicMethod: function () {
      console.log('hello world');
    },
    publicProperty: 'test'
  };
}

return {
  getInstance: function () {
    if (!instantiated) {
      instantiated = init();
    }
    return instantiated;
  }
};
})();

/*调用公有的方法来获取实例:*/
Singleton.getInstance().publicMethod(); 

Through the above method, we can do only initialized when in use, so as to achieve the purpose of saving resources

At present, for understanding Singleton pattern so much, after a new understanding we will continue to update, and slipped slipped (~ ¯ ▽ ¯) ~

Guess you like

Origin www.cnblogs.com/loveyt/p/11413474.html