Heim > Web-Frontend > js-Tutorial > Hauptteil

Detaillierte Erläuterung des JavaScript-Einzelspaltenmodus und der Einzelmodusdefinition sowie des Anwendungscodes

伊谢尔伦
Freigeben: 2017-07-24 14:01:23
Original
1406 Leute haben es durchsucht

Einzelmodus:

Single ist ein Objekt, das zum Teilen des Namespace und zum Organisieren einer Gruppe verwandter Eigenschaften und Methoden verwendet wird. Wenn er instanziiert werden kann, kann er nur instanziiert werden einmal.

Funktionen:

kann den Namespace aufteilen, um die durch globale Variablen verursachten Gefahren zu beseitigen.

Verwenden Sie die Verzweigungstechnologie, um Unterschiede zwischen Browsern zu kapseln.

kann den Code in einer integrierteren Struktur organisieren, wodurch er einfacher zu lesen und zu warten ist.

Code-Implementierung:

/*Basic Singleton*/
var Singleton = {
  attribute:true,
  method1:function(){},
   method2:function(){}
};
Nach dem Login kopieren

Anwendungsszenario:

Der Einzelmodus wird häufig in unseren täglichen Anwendungen verwendet, was der Kapselung unseres Codes in zusammen entspricht. nur ein Eingang ist freigelegt, wodurch eine Kontamination aller Variablen vermieden wird.

Singleton-Muster

Das Singleton-Muster definiert den Erstellungsprozess eines Objekts. Dieses Objekt verfügt nur über eine einzige Instanz und bietet einen globalen Zugriff darauf Punkt. Man kann auch sagen, dass ein Singleton sicherstellen soll, dass eine Klasse nur eine Instanz hat. Die Implementierungsmethode besteht im Allgemeinen darin, zunächst festzustellen, ob die Instanz vorhanden ist. Wenn sie nicht vorhanden ist, wird sie dann erstellt Gibt es zurück. Dadurch wird sichergestellt, dass eine Klasse nur ein Instanzobjekt hat.

Code-Implementierung:

Es gibt viele Möglichkeiten, Singletons zu implementieren. Nachfolgend wird nur eine davon vorgestellt. Der Code lautet wie folgt

var single = (function(){
  var unique;
  function getInstance(){
    // 如果该实例存在,则直接返回,否则就对其实例化
    if( unique === undefined ){
      unique = new Construct();
    }
    return unique;
  }
  function Construct(){
    // ... 生成单例的构造函数的代码
  }
  return {
    getInstance : getInstance
  }
})();
Nach dem Login kopieren
Im obigen Code ist „unique“ der Verweis auf das zurückgegebene Objekt und „getInstance“ die statische Methode zum Abrufen der Instanz. Construct ist der Konstruktor, der eine Instanz erstellt.

Sie können eine einzelne Instanz über single.getInstance() abrufen, und bei jedem Aufruf wird dieselbe einzelne Instanz abgerufen. Dies ist es, was das Singleton-Muster erreicht.

Verwendungsszenarien:

Der Singleton-Modus ist ein häufig verwendeter Modus. Es gibt einige Objekte, die wir oft nur benötigen, z. B. den globalen Cache und das Fensterobjekt des Browsers. In der js-Entwicklung wird auch das Singleton-Muster sehr häufig verwendet. Stellen Sie sich vor, wenn wir

auf die Anmeldeschaltfläche klicken, erscheint ein Anmeldefeld auf der Seite, und dieses schwebende Fenster ist einzigartig. Egal wie oft wir auf die Anmeldeschaltfläche klicken, dieses schwebende Fenster wird nur erstellt einmal. . Daher ist dieses schwebende Anmeldefenster für den Singleton-Modus geeignet.

Fassen Sie die Verwendungsszenarien zusammen:

1. Sie können es verwenden, um den Namespace zu unterteilen

2. Mit Hilfe des Singleton-Modus kann der Code konsistenter organisiert werden . Einfach zu lesen und zu warten

Das obige ist der detaillierte Inhalt vonDetaillierte Erläuterung des JavaScript-Einzelspaltenmodus und der Einzelmodusdefinition sowie des Anwendungscodes. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage