Einfachste / sauberste Möglichkeit, ein Singleton in JavaScript zu implementieren

Question

Was ist der einfachste/sauberste Weg, um das Singleton-Muster in JavaScript zu implementieren?

Answer 1

Ich denke, der einfachste Weg ist es, ein einfaches Objektliteral zu deklarieren:

var myInstance = {
  method1: function () {
    // ...
  },
  method2: function () {
    // ...
  }
};

Wenn Sie private Elemente auf Ihrer Singleton-Instanz möchten, können Sie etwas wie dies tun:

var myInstance = (function() {
  var privateVar = '';

  function privateMethod () {
    // ...
  }

  return { // öffentliche Schnittstelle
    publicMethod1: function () {
      // Alle privaten Elemente sind hier zugänglich
    },
    publicMethod2: function () {
    }
  };
})();

Dies wird als das Modulmuster bezeichnet und ermöglicht es im Grunde, private Elemente in einem Objekt zu kapseln, indem die Verwendung von Closures genutzt wird.

Wenn Sie die Änderung des Singleton-Objekts verhindern möchten, können Sie es einfrieren, indem Sie die ES5 Object.freeze-Methode verwenden.

Dadurch wird das Objekt unveränderlich gemacht und verhindert jede Änderung seiner Struktur und Werte.

Wenn Sie ES6 verwenden, können Sie einen Singleton sehr einfach mit ES-Modulen darstellen und sogar privaten Zustand speichern, indem Sie Variablen im Modul-Bereich deklarieren:

// my-singleton.js
const somePrivateState = []

function privateFn () {
  // ...
}

export default {
  method1() {
    // ...
  },
  method2() {
    // ...
  }
}

Dann können Sie das Singleton-Objekt einfach importieren, um es zu verwenden:

import myInstance from './my-singleton.js'
// ...

Answer 2

Ich glaube, der sauberste Ansatz ist etwas wie:

var SingletonFactory = (function(){
    function SingletonClass() {
        //do stuff
    }
    var instance;
    return {
        getInstance: function(){
            if (instance == null) {
                instance = new SingletonClass();
                // Hide the constructor so the returned object can't be new'd...
                instance.constructor = null;
            }
            return instance;
        }
   };
})();

Danach kannst du die Funktion aufrufen als:

var test = SingletonFactory.getInstance();

Answer 3

Ich bin mir nicht sicher, ob ich damit einverstanden bin, dass das Modulmuster als Ersatz für ein Singleton-Muster verwendet wird. Ich habe oft gesehen, dass Singleton-Muster an Orten verwendet und missbraucht werden, wo sie völlig unnötig sind, und ich bin sicher, dass das Modulmuster viele Lücken füllt, wo Programmierer ansonsten ein Singleton verwenden würden. Das Modulmuster ist jedoch nicht ein Singleton.

Modulmuster:

var foo = (function () {
    "use strict";
    function aPrivateFunction() {}
    return { aPublicFunction: function () {...}, ... };
}());

Alles, was im Modulmuster initialisiert wird, passiert beim Deklarieren von Foo. Darüber hinaus kann das Modulmuster verwendet werden, um einen Konstruktor zu initialisieren, der dann mehrmals instanziiert werden könnte. Obwohl das Modulmuster das richtige Werkzeug für viele Aufgaben ist, entspricht es nicht einem Singleton.

Singleton-Muster:

_Kurzform

var Foo = function () {
    "use strict";
    if (Foo._instance) {
        // Dies ermöglicht es, den Konstruktor mehrmals aufzurufen
        // und sich auf dieselbe Instanz zu beziehen. Eine andere Option wäre es,
        // einen Fehler zu werfen.
        return Foo._instance;
    }
    Foo._instance = this;
    // Foo-Initialisierungscode
};
Foo.getInstance = function () {
    "use strict";
    return Foo._instance || new Foo();
}

_{Langform, mit Verwendung des Modulmusters}

var Foo = (function () {
    "use strict";
    var instance; // Verhindert die Änderung der "instance"-Variable
    function Singleton() {
        if (instance) {
            return instance;
        }
        instance = this;
        // Singleton-Initialisierungscode
    }
    // Instanz-Zugriff
    Singleton.getInstance = function () {
        return instance || new Singleton();
    }
    return Singleton;
}());

In beiden Versionen des von mir bereitgestellten Singleton-Musters kann der Konstruktor selbst als Zugriffspunkt verwendet werden:

var a,
    b;
a = new Foo(); // Die Initialisierung des Konstruktors erfolgt hier
b = new Foo();
console.log(a === b); // true

Wenn Sie sich nicht wohl dabei fühlen, den Konstruktor auf diese Weise zu verwenden, können Sie einen Fehler im if (instance)-Statement werfen und sich auf die Verwendung der Langform beschränken:

var a,
    b;
a = Foo.getInstance(); // Die Initialisierung des Konstruktors erfolgt hier
b = Foo.getInstance();
console.log(a === b); // true

---

Ich sollte auch erwähnen, dass das Singleton-Muster gut zum impliziten Konstruktorfunktionsmuster passt:

function Foo() {
    if (Foo._instance) {
        return Foo._instance;
    }
    // Wenn die Funktion nicht als Konstruktor aufgerufen wurde,
    // rufen Sie sie als Konstruktor auf und geben Sie das Ergebnis zurück
    if (!(this instanceof Foo)) {
        return new Foo();
    }
    Foo._instance = this;
}
var f = new Foo(); // Ruft Foo als Konstruktor auf
-oder-
var f = Foo(); // Ruft auch Foo als Konstruktor auf

Answer 4

In ES6 ist der richtige Weg, dies zu tun:

class MyClass {
  constructor() {
    if (MyClass._instance) {
      throw new Error("Singleton-Klassen können nicht mehr als einmal instanziiert werden.")
    }
    MyClass._instance = this;

    // ... Der Rest Ihres Konstruktorcodes erfolgt nach diesem
  }
}

var instanceOne = new MyClass() // Wird erfolgreich ausgeführt
var instanceTwo = new MyClass() // Gibt Fehler aus

Oder, wenn Sie nicht möchten, dass bei der Erstellung der zweiten Instanz ein Fehler ausgegeben wird, können Sie einfach die letzte Instanz zurückgeben, wie folgt:

class MyClass {
  constructor() {
    if (MyClass._instance) {
      return MyClass._instance
    }
    MyClass._instance = this;

    // ... Der Rest Ihres Konstruktorcodes erfolgt nach diesem
  }
}

var instanceOne = new MyClass()
var instanceTwo = new MyClass()

console.log(instanceOne === instanceTwo) // Gibt "true" aus

Answer 5

In ECMAScript 2015 (ES6):

class Singleton {
  constructor () {
    if (!Singleton.instance) {
      Singleton.instance = this
    }
    // Initialize object
    return Singleton.instance
  }
  // Properties & Methods
}

const instance = new Singleton()
Object.freeze(instance)

export default instance

would be translated to:

In ECMAScript 2015 (ES6):

class Singleton {
  constructor () {
    if (!Singleton.instance) {
      Singleton.instance = this
    }
    // Objekt initialisieren
    return Singleton.instance
  }
  // Eigenschaften & Methoden
}

const instance = new Singleton()
Object.freeze(instance)

export default instance