Können Sie Abschlüsse in einfachem Englisch beschreiben?

Haha – ich fühle mich schlecht, da die einzigen Antworten hier kaum in einfachem Englisch sind:

Ein Closure ist einfach eine Funktion, die Zugriff auf ihren äußeren Gültigkeitsbereich hat, auch wenn sie außerhalb dieses Gültigkeitsbereichs ausgeführt wird .

Da Javascript funktionsspezifisch ist (für jede Funktion wird ein Bereich erstellt),

Dies bedeutet, dass jedes Mal, wenn eine Funktion in einer anderen Funktion deklariert wird , ein Abschluss erstellt wird. Es ist eine Funktion der Javascript-Sprache und kein Trick, den Programmierer verwenden.

Hier ist eine vollständige Behandlung zu diesem Thema,

Grundlegendes zu Javascript-Closures

Sie werden sehen, dass Closures eigentlich sehr einfach sind und wichtig zu verstehen sind, wenn Sie gute Javascript-Objekte, -Module oder ähnliches schreiben möchten.

____

Nun, da wir mit dem einfachen Englisch fertig sind. Ich werde ein Beispiel geben.

Wir werden mit der folgenden Funktion beginnen:

  Funktionsklasse (a) {var _a = a;}

Weisen Sie diese Funktion nun einer Variablen zu und führen Sie sie aus:

  var class = function Klasse (a) {}; Klasse ('math')

Wenn der Javascript-Compiler den obigen Code liest, wird ein sogenannter Ausführungskontext erstellt. Kurz gesagt bedeutet dies im Grunde, dass jeder Code, der in dieser Funktion ausgeführt wird, in einem separaten Speicherbereich gespeichert ist.

Also haben wir den Code ausgeführt. Wir können sehen, dass der erste Ausführungskontext die Variable _a enthält.

  Funktionsklasse (a) {var _a = a;}

Jetzt habe ich eine Funktion definiert, die in dieser übergeordneten Funktion verschachtelt ist.

  Funktionsklasse (a) {  
      
   var _a = a;      
   this.getA = function () {return _a}; 
 
 };

Denken Sie daran, dass Funktionen ihre eigenen Ausführungskontexte unabhängig voneinander haben.

Kehren wir zu unserem Code zurück und führen Sie die verschachtelte Funktion aus

  var c = Funktionsklasse (a) {};
 var class_function = c ('math')
 class_function.getA ()

Nachdem wir diese zweite, verschachtelte Funktion aufgerufen haben, wird der Javascript-Compiler aktiviert.

  Funktionsklasse (a) { 
        
   var _a = a;   
   this.getA = function () {     
              
   return _a     
         
   };
    
 };

Sie können meinen schrecklichen Anmerkungen entnehmen, dass hier ein NEUER Ausführungskontext erstellt wurde. Alle Variablen in dieser Funktion werden in den Speicher geladen und nur dieser bestimmten Funktion zur Verfügung gestellt. Sie können außerhalb dieser Funktion nicht verwendet werden.

Also wie ist es dann das

  class_function.getA () // => 'math'

Gibt ‘math’ zurück, die in der übergeordneten Funktion definierte Variable? Wie weiß die Funktion IN DER übergeordneten Funktion, wie die Definition von _a lautet?

Die untergeordnete Funktion hat die übergeordneten Funktionsvariablen ENCLOSED und behält sie im Speicher bei, wenn der neue Ausführungskontext für die untergeordnete Funktion erstellt wird.

Es gibt zahlreiche praktische Anwendungen, aber dies ist kaum ein Trick. Abschlüsse beziehen sich auf den Umfang.

Dies ist nur ein kurzes Beispiel. Wenn Sie mehr über Closures erfahren möchten, lesen Sie diesen ausführlichen Artikel, den ich zu diesem Thema geschrieben habe.

Grundlegendes zu Javascript-Closures

Hoffe das hilft,

Erik

  Funktion startAt (x) {
     Funktion incrementBy (y) {
        return x + y
     }
     return incrementBy;
 }

 var closure = startAt (1);
 Alarm (Schließung (10));  // Warnungen 11

Einfaches Englisch:

Sie können nicht direkt auf incrementBy (y) außerhalb von startAt (x) zugreifen, aber Sie können es mit dem Parameter über die von startAt () zurückgegebene Funktionsreferenz aufrufen, und die Auswertung erfolgt im Rahmen des Abschlusses.

Interessanterweise können Sie den var-Abschluss weglassen und einfach aufrufen:

alert(startAt(1)(10));

das würde die gleiche 11 zurückgeben.

Wenn Sie also den Code ein wenig ändern, erhalten Sie etwas vage Klartextes:

  Funktion startAt (x) {
     Funktion incrementBy (y) {
        return x + y
     }
     Rückkehr {
         incrementBy: incrementBy
     };
 }

 alert (startAt (1) .incrementBy (10));  // alarmiert 11

Und selbst wenn Sie die Funktionen innerhalb des Abschlusses umbenennen, funktioniert dies mit demselben Aufruf:

  Funktion startAt (x) {
     Funktion was auch immer (y) {
        return x + y
     }
     Rückkehr {
         incrementBy: whatEver
     };
 }

 alert (startAt (1) .incrementBy (10));  // alarmiert 11

Dies macht die Verschlüsse sehr nützlich, um interne Implementierungen von externen Anwendungen zu abstrahieren. Beispielsweise.

Könnte minimalistisch sein, aber ich würde sagen, Funktionen in anderen Funktionen.

More Interesting

Wie schreiben Sie lieber Ihre Javascript-Funktionen und -Objekte

Wie ist es, Node.js mit MySql zu verwenden?

Wie kann ich mehr über JavaScript erfahren, wenn ich jQuery bereits kenne?

Ich benutze Openerp Web und Server 5.15. Gibt es eine Möglichkeit, die Sitzung des Benutzers zu beenden. Als er / sie das Browserfenster geschlossen hat. Wenn nicht, dann gibt es einen javscript-Weg, den ich auf demselben implementieren kann.

Oneline Python: Wie stehen Sie zu WebSockets und dessen Verwendung in der Produktion über XHR und anderen Folklorestrategien?

Was ist besser für die Spieleentwicklung für einen vollständigen Neuling, C #, Java oder JavaScript?

Ist es für die Vererbung mit JavaScript besser, den Prototyp des übergeordneten Elements zu referenzieren oder zu kopieren?

Also ich kenne JavaScript, was nun?

Was ist der Unterschied zwischen Rückruffunktion und Versprechen in JS und in welchem ​​Fall müssen wir diese verwenden?

Warum können wir kein Objekt für die Schnittstelle in Java erstellen?

Was ist der beste Weg, um nicht-triviales interaktives JavaScript zu debuggen?

Warum haben sich JavaScript / JavaScript-basierte Frameworks kürzlich verabschiedet?

Was sind einige gute Ressourcen, um mehr über die Schließmuster von JavaScript zu erfahren?

React und express.js Neuling: Ich versuche, dieselbe Top-Level-React-Komponente zu verwenden, um eine Seite abhängig vom besuchten "Pfad" bedingt anzuzeigen. Wie können Daten am besten an die Komponente der obersten Ebene übergeben werden, damit sie unter bestimmten Bedingungen gerendert werden können?

Warum ist React.JS heutzutage beliebter?