Ausführliche Erläuterung, wie ES6 zum Implementieren des Singleton-Musters und seiner Anwendungen verwendet wird

Singleton ist eine sehr grundlegende Sache in der Programmierung. Dieser Artikel führt Sie hauptsächlich in die relevanten Informationen zur Verwendung von ES6 zur Implementierung des Singleton-Musters und seiner Anwendung ein. Der Artikel stellt es ausführlich anhand von Beispielcode vor Ich hoffe, es hilft allen.

Vorwort

In den Augen traditioneller Entwicklungsingenieure besteht ein Singleton darin, sicherzustellen, dass eine Klasse nur eine Instanz hat. Die Implementierungsmethode besteht im Allgemeinen darin, zunächst festzustellen, ob die Instanz vorhanden ist , wird es direkt zurückgegeben, wenn es nicht existiert. Es wird erstellt und dann zurückgegeben, wodurch sichergestellt wird, dass eine Klasse nur ein Instanzobjekt hat. In JavaScript fungiert ein Singleton als Namespace-Anbieter und stellt einen eindeutigen Zugriffspunkt auf das Objekt aus dem globalen Namespace bereit.

Die Definition des Singleton-Musters besteht darin, sicherzustellen, dass eine Klasse nur eine Instanz hat und einen globalen Zugriffspunkt für den Zugriff darauf bereitzustellen.

Das Singleton-Muster erstellt Objekte zur richtigen Zeit und erstellt das einzige.

Der Code ist lebensnah und sehr interessant. Wenn Sie sich beispielsweise auf einer Website anmelden, wird nach dem Klicken auf „Anmelden“ ein Anmelde-Popup-Fenster angezeigt. Auch wenn Sie erneut klicken, wird dasselbe Popup-Fenster nicht erneut angezeigt. Oder wenn der Benutzer in einem Musik-Player-Programm ein Musikstück öffnet und ein anderes Musikstück öffnen möchte, wird die vorherige Wiedergabeschnittstelle automatisch geschlossen und zur aktuellen Wiedergabeschnittstelle gewechselt. Dies sind alles Anwendungsszenarien des Singleton-Musters.

Um ein Singleton-Muster zu implementieren, besteht eine klassische Methode darin, eine Klasse zu erstellen. Es gibt eine andere Methode in der Klasse, die ein Instanzobjekt der Klasse erstellen kann, und es gibt auch eine Markierung, um aufzuzeichnen, ob Es wurde ein Instanzobjekt erstellt. Wenn das Objekt bereits vorhanden ist, wird ein Verweis auf das erste instanziierte Objekt zurückgegeben.

Implementierung des Singleton-Musters

ES5-Implementierungsmethode

var Singleton = function(name) {
 this.name = name;
 //一个标记，用来判断是否已将创建了该类的实例
 this.instance = null;
}
// 提供了一个静态方法，用户可以直接在类上调用
Singleton.getInstance = function(name) {
 // 没有实例化的时候创建一个该类的实例
 if(!this.instance) {
  this.instance = new Singleton(name);
 }
 // 已经实例化了，返回第一次实例化对象的引用
 return this.instance;
}

Benutzer können A bestehen bekannte Schnittstelle für den Zugriff auf diese Instanz.

Wir versuchen, das Objekt zweimal zu instanziieren und beobachten, ob die beiden Instanziierungsergebnisse auf dasselbe Objekt verweisen.

var a = Singleton.getInstance('sven1');
var b = Singleton.getInstance('sven2');
// 指向的是唯一实例化的对象
console.log(a === b);

Das Rückgabeergebnis ist: wahr. Erklären Sie, dass zwischen a und b eine Referenzbeziehung besteht.

ES6-Implementierungsmethode

Singleton-Klasse erstellen. Das Klassenschlüsselwort und die statischen Funktionen sind beide neu in es6.

class Singleton {
 constructor(name) {
  this.name = name;
  this.instance = null;
 }
 // 构造一个广为人知的接口，供用户对该类进行实例化
 static getInstance(name) {
  if(!this.instance) {
   this.instance = new Singleton(name);
  }
  return this.instance;
 }
}

Beispiel für eine Singleton-Musteranwendung

Wir verwenden ein alltägliches Szenario im Leben, um die Singleton-Musteranwendung zu veranschaulichen.

Wenn Sie auf einer Website auf die Anmeldeschaltfläche klicken, wird nur ein Anmeldefeld angezeigt. Auch wenn Sie später erneut auf die Anmeldeschaltfläche klicken, werden keine weiteren Popup-Fenster angezeigt. Dies ist eine typische Anwendung des Singleton-Musters. Als nächstes implementieren wir es. Um uns auf die Anzeige des Singleton-Modus zu konzentrieren, vereinfachen wir das Anmeldefeld.

Das obige ist der detaillierte Inhalt vonAusführliche Erläuterung, wie ES6 zum Implementieren des Singleton-Musters und seiner Anwendungen verwendet wird. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!