Detaillierte Erläuterung der Verwendung von js-Closure_Grundkenntnisse

Werfen wir einen Blick auf die Einsatzmöglichkeiten von Verschlüssen. Tatsächlich können wir durch die Verwendung von Verschlüssen viele Dinge tun. Es kann beispielsweise den objektorientierten Codierungsstil simulieren, den Code eleganter und prägnanter ausdrücken und die Ausführungseffizienz des Codes in einigen Aspekten verbessern.

1 Anonyme selbstausführende Funktion

Wir kennen alle Variablen. Wenn Sie das Schlüsselwort var nicht hinzufügen, werden sie standardmäßig zu den Eigenschaften des globalen Objekts hinzugefügt. Das Hinzufügen solcher temporären Variablen zum globalen Objekt hat viele Nachteile Beispielsweise können andere Funktionen diese Variablen missbrauchen, was dazu führt, dass das globale Objekt zu groß wird und die Zugriffsgeschwindigkeit beeinträchtigt wird (da der Wert der Variablen von der Prototypenkette durchlaufen werden muss).
Zusätzlich zur Verwendung des Schlüsselworts var bei jeder Verwendung einer Variablen kommt es in tatsächlichen Situationen häufig vor, dass einige Funktionen nur einmal ausgeführt werden müssen und ihre internen Variablen nicht verwaltet werden müssen
Für die Initialisierung der Benutzeroberfläche können wir beispielsweise Abschlüsse verwenden:

Code kopieren Der Code lautet wie folgt:

var datamodel = { 
Tabelle: [],
Baum: {}
}; 
​  
(Funktion(dm){ 
for(var i = 0; i < dm.table.rows; i ){
      var row = dm.table.rows[i];                             for(var j = 0; j < row.cells; i ){
             drawCell(i, j);                                                                                                        }  
                           
//dm.tree erstellen
})(Datenmodell);



Wir erstellen eine anonyme Funktion und führen sie sofort aus, da die darin enthaltenen Variablen nicht von außen referenziert werden können,
Daher wird es bald nach der Ausführung freigegeben. Der Schlüssel liegt darin, dass dieser Mechanismus das globale Objekt nicht verunreinigt.

2 Cache

Sehen wir uns ein anderes Beispiel an, wir haben ein Funktionsobjekt, dessen Verarbeitung sehr zeitaufwändig ist,

Dann müssen wir den berechneten Wert speichern, ihn zuerst im Cache suchen und ihn dann berechnen

Aktualisieren Sie dann den Cache und geben Sie den Wert zurück. Wenn er gefunden wird, geben Sie den gefundenen Wert einfach direkt zurück. Schließungen tun genau dies, weil sie keine externen Referenzen freigeben,

Dadurch kann der Wert innerhalb der Funktion erhalten bleiben.

Code kopieren

Der Code lautet wie folgt:

var CachedSearchBox = (function(){
var Cache = {},
Anzahl = [];
Geben Sie {
zurück attachmentSearchBox: function(dsid){
If (dsid im Cache) {// Wenn das Ergebnis im Cache ist
Cache zurückgeben [dsid]; // Direkt zum Objekt im Cache zurückkehren
                                                                              var fsb = new uikit.webctrl.SearchBox(dsid);//New  
              Cache[dsid] = fsb;//Cache aktualisieren                                                     If (count.length & gt; 100) {// Die Größe des Cache-Cache & lt = 100
                                                                                                                                                                                                                            Cache löschen[count.shift()];                                                                                  return fsb;                                                            },                                                    ​  
Clearsearchbox: Funktion (dsid) {
If(dsid im Cache){
Cache[dsid].clearSelection();
                                                                                                                                        };  
})();
​  
CachedSearchBox.attachSearchBox("input1");



Auf diese Weise, wenn wir CachedSearchBox.attachSerachBox("input1") zum zweiten Mal aufrufen,
Wir können das Objekt aus dem Cache abrufen, ohne ein neues Suchfeldobjekt zu erstellen.

3 Kapselung implementieren

Sie können sich zunächst ein Beispiel für die Kapselung ansehen. Auf die internen Variablen kann nicht außerhalb der Person zugegriffen werden, sondern durch Bereitstellung eines Abschlusses:

Code kopieren

Der Code lautet wie folgt:

var person = function(){  //Variablenbereich liegt innerhalb der Funktion und kann von außen nicht aufgerufen werden Var-Name = „Standard“; Var-Name                             Geben Sie { zurück           getName : function(){                                                    Rückname;                                                     },                                                              setName : function(newName){                                               name = newName;                                                                                                                       }  

}();

​  
print(person.name);// Direkter Zugriff, das Ergebnis ist undefiniert
print(person.getName());
person.setName("abruzzi");
print(person.getName());



Das Ergebnis ist wie folgt:

undefiniert
Standard
Abruzzen

4 Eine weitere wichtige Verwendung von Abschlüssen besteht darin, Objekte objektorientiert zu implementieren. Traditionelle Objektsprachen bieten Klassenvorlagenmechanismen,
Auf diese Weise haben verschiedene Objekte (Instanzen von Klassen) unabhängige Mitglieder und Zustände und stören sich nicht gegenseitig. Obwohl es in JavaScript keinen Mechanismus wie Klassen gibt, durch die Verwendung von Abschlüssen,
Wir können einen solchen Mechanismus simulieren. Nehmen wir das obige Beispiel:

Code kopieren


Der Code lautet wie folgt:

Funktion Person(){ 
Var-Name = „Standard“; Var-Name
                           
Geben Sie {
zurück           getName : function(){                                                    Rückname;                                                     },                                                              setName : function(newName){                                               name = newName;                                                                                                                       }  
}; 
​  
​  
var john = Person();
print(john.getName());
john.setName("john");
print(john.getName());
​  
var jack = Person();
print(jack.getName());
jack.setName("jack");
print(jack.getName());



Die Laufergebnisse sind wie folgt:

Standard
John

Standard Jack

Aus diesem Code ist ersichtlich, dass sowohl John als auch Jack als Instanzen der Person-Klasse bezeichnet werden können, da der Zugriff der beiden Instanzen auf das Namensmitglied unabhängig ist und sich nicht gegenseitig beeinflusst.

Das Obige ist die Funktion des js-Abschlusses. Es ist sehr einfach und leicht zu verstehen. Ich hoffe, es wird meinen Freunden helfen