Implementierung des Singleton-Musters in JavaScript ES6+: Eine Schritt-für-Schritt-Anleitung

In diesem Artikel zeige ich Ihnen, wie Sie das Singleton-Muster in JavaScript implementieren.

Wenn Sie ein Full-Stack-JavaScript-Entwickler sind, wissen Sie, dass JavaScript eine leistungsstarke Sprache ist, mit der Sie fantastische Websites erstellen können. Wenn Sie JavaScript hingegen nur für die Front-End-Formularvalidierung und AJAX-Aufrufe verwenden, haben Sie nur an der Oberfläche dessen gekratzt, was es leisten kann, und es ist viel mehr als das. Da es sich um eine funktionsreiche Sprache handelt, gibt es viele darauf aufbauende Frameworks.

In diesem Artikel besprechen wir ein nützliches Programmiermuster in objektorientiertem JavaScript: das Singleton-Muster. Singleton-Objekte werden nur einmal im globalen Bereich erstellt, während die Anwendung ausgeführt wird. Sie werden verwendet, um Ressourcen gemeinsam zu nutzen oder zwischen verschiedenen Teilen der Anwendung zu koordinieren.

Was ist ein Singleton-Muster?

Werfen wir einen Blick auf die Definition des Singleton-Musters:

In der Softwareentwicklung ist das Singleton-Muster ein Software-Designmuster, das die Instanziierung einer Klasse auf eine „einzelne“ Instanz beschränkt. Dies ist nützlich, wenn nur ein Objekt benötigt wird, um den Betrieb des gesamten Systems zu koordinieren.

Wenn Sie eine Anwendung entwickeln, müssen Sie manchmal globale Objekte in der gesamten Anwendung erstellen. Insbesondere möchten Sie ein Objekt, das während der gesamten Lebensdauer der Anforderung nur einmal instanziiert wird. Beispielsweise könnte es sich um ein Datenbankverbindungsobjekt handeln, das Sie für alle Anforderungen global halten möchten, da Sie nicht für jede Anforderung mehrere Datenbankobjekte erstellen müssen. In diesem Fall ist das Singleton-Muster sehr nützlich, da es garantiert, dass nur eine einzige Kopie des Objekts instanziiert wird.

Kurzübersicht: Singleton-Muster in älteren Versionen von JavaScript

In diesem Abschnitt werfen wir einen kurzen Blick darauf, wie das Singleton-Muster in älteren Versionen von JavaScript implementiert wird.

Schauen wir uns das folgende Beispiel an.

Im obigen Beispiel haben wir die Methode Singleton 对象实现为闭包，因此它将立即被调用。它实现了 getInstance 方法，我们可以调用该方法来实例化一个对象。在 getInstance 方法中，我们检查 instance 属性是否已经拥有我们正在查找的对象，如果存在，我们不会创建另一个对象。如果它不包含任何对象，我们将调用 createInstance verwendet, um ein neues Objekt zu instanziieren und es dann zurückzugeben. Auf diese Weise wird sichergestellt, dass immer nur eine einzige Kopie des Objekts erstellt wird, wenn Sie versuchen, ein neues Objekt zu instanziieren.

Um es zu demonstrieren, rufen wir die Methode Singleton.getInstance() zweimal auf, um zu prüfen, ob sie tatsächlich zwei verschiedene Objekte erstellt. In der Konsole sollten Sie sehen können, dass beide Objekte identisch sind und dasselbe Datum und dieselbe Uhrzeit ausgeben.

So implementieren Sie das Singleton-Muster in älteren Versionen von JavaScript. Im nächsten Abschnitt erfahren Sie, wie Sie dies in der JavaScript ES6+-Version implementieren.

Singleton-Muster in ES6+

In diesem Abschnitt erfahren Sie, wie Sie das Singleton-Muster in der JavaScript ES6+-Version implementieren. Wenn es um die ES6-Methode geht, gibt es verschiedene Möglichkeiten, das Singleton-Muster zu implementieren.

ES6-Module

Wenn Sie ES6-Module verwendet haben und es noch nicht wussten: ES6-Module sind standardmäßig Singletons. Insbesondere durch die Kombination von Modulen und dem Schlüsselwort const können Sie ganz einfach Singletons schreiben.

Werfen wir einen Blick auf den ES6-Modulcode unten.

const currentDateAndTime = new Object("I am instantiated at:" + new Date().toLocaleString());

export default currentDateAndTime;

Jetzt erhalten Sie garantiert jedes Mal, wenn Sie das obige ES6-Modul importieren, die gleiche Version von currentDateAndTime 对象。由于 currentDateAndTime Das Objekt ist auf das Modul beschränkt, sodass Sie jedes Mal, wenn Sie das obige ES6-Modul in andere Dateien einbinden, garantiert erhalten dasselbe Objekt.

ES6-Klassen

In diesem Abschnitt erfahren Sie, wie Sie das Singleton-Muster mithilfe von ES6-Klassen implementieren.

Schauen wir uns das folgende Beispiel an.

Wie Sie sehen können, haben wir die Klasse DBConnection implementiert, mit der wir Datenbankverbindungsobjekte in unseren Anwendungen instanziieren können.

Um dies zu testen, instanziieren wir zwei Objekte, indem wir die Methode getInstance der DBConnection 类的 getInstance 方法实例化了两个对象。然后，我们比较两个对象，看看它们是否相同。由于我们使用的是单例模式，因此它们应该是相同的，并且 console.log 语句将打印 true-Klasse aufrufen. Anschließend vergleichen wir die beiden Objekte, um festzustellen, ob sie gleich sind. Da wir das Singleton-Muster verwenden, sollten sie identisch sein und die console.log-Anweisung gibt zur Bestätigung true aus. Sie können dies als Lazy-Singleton-Objekt bezeichnen, da das Objekt nur bei Bedarf und nicht beim ersten Laden erstellt wird.

So definieren Sie eine Klasse, die das Singleton-Muster implementiert.

带有模块的 ES6 类

在本节中，我们将了解如何使用 ES6 类和模块来实现单例模式。

让我们看一下下面的例子。

  constructor(conString) {}

  static getInstance(conString) {
    if (!this.instance) {
      this.instance = new DBConnection(conString);
    }

    return this.instance;
  }
}

const dbConObj = DBConnection.getInstance('mysqldb1');

export default dbConObj;

创建作用域为模块的类的实例是实现单例模式的最佳方法。因此，如果您正在使用 ES6 模块，这是使用 ES6 类实现单例模式的推荐方法。

这就是如何使用 ES6 类和模块实现单例模式。

结论

今天，我们讨论了 JavaScript 中的单例模式。除了基础知识之外，我们还通过几个示例来了解它如何与不同版本的 JavaScript 配合使用。

Das obige ist der detaillierte Inhalt vonImplementierung des Singleton-Musters in JavaScript ES6+: Eine Schritt-für-Schritt-Anleitung. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!