The singleton pattern

The singleton pattern, as the name implies, has only one instance. So the question is, why is there only one instance? In JS, there are constructors and classes that can create instances (new in ES6, essentially syntactic sugar).

So the singleton pattern is defined to ensure that a class has only one instance and provide a global access point to access it.

In front-end development, you often need only one global object, such as the Window object. There are also components that do not need to be created repeatedly, such as loading components.

Implement the singleton pattern

Knowing what a singleton pattern is, it is not difficult to implement one. You can cache an instance with a variable, and each time you create an instance, determine if it has already been created, and if so, return the cached instance,

var Singleton = function(name) {
    this.name = name;
    this.instance = null;
};

Singleton.prototype.getName = function() {
    return this.name;
};

Singleton.getInstance = function(name) {
    if (!this.instance) {
        this.instance = new Singleton(name);
    }
    return this.instance;
};

var a = Singleton.getInstance('instance1');
var b = Singleton.getInstance('instance2');

console.log(a === b); // true
Copy the code

You can also use IIFE to cache instances in closures:

var Singleton = function(name) {
    this.name = name;
};

Singleton.prototype.getName = function() {
    return this.name;
};

Singleton.getInstance = function() {
    var instance = null;
    return function(name) {
        if(! instance) { instance =new Singleton(name);
        }
        return instance;
    };
};

var a = Singleton.getInstance('instance1');
var b = Singleton.getInstance('instance2');

console.log(a === b); // true
Copy the code

You can now get a unique instance of the Singleton class through Singleton.getInstance. This way is easier. Contrary to the syntax of new, the user must know that this is a singleton class.

Create a transparent singleton class:

var Singleton = (function() {
    var instance = null;
    var Singleton = function(name) {
        if (instance) {
            return instance;
        }
        this.name = name;
        return (instance = this);
    };
    returnSingleton; }) ();Copy the code

A singleton class that uses new to get unique instances is implemented with closures and immediate-execute functions.

But there’s a problem. This class actually does two things, create an object and guarantee a singleton. When we want to change one of the behavior, we have to change the object.

Introducing proxy classes

The proxy class guarantees singletons, with specialized objects responsible for creating objects.

var Singleton = function(name) {
    this.name = name;
};

var ProxySingleton = (function() {
    var instance = null;
    return function(name) {
        if(! instance) { instance =new Singleton(name);
        }
        returninstance; }; }) ();var a = new ProxySingleton('instance1');
var b = new ProxySingleton('instance2');

console.log(a === b); // true
Copy the code

Inert singleton

Lazy singletons are instances of objects that are created only when needed. In fact, the implementation we wrote at the beginning is an inert singleton instance. The Instance instance object is always created after singleton.getInstance is called.

summary

As you can see from the examples, the singleton pattern can’t be implemented without closures and higher-order functions, and it is best to separate the guarantee singleton from the creation of objects to have the power of the singleton pattern.

PS

This is my reading notes, if there are mistakes, welcome to point out.