1. Was ist das Schreiben und Gebrauch von Schließungen und Schließungen?
1. Was ist eine Schließung?
Schließungen, die offizielle Erklärung von Schließungen lautet: ein Ausdruck (normalerweise eine Funktion), der viele Variablen und eine um diese Variablen gebundene Umgebung aufweist, sodass diese Variablen auch Teil des Ausdrucks sind. Merkmale von Schließungen:
1). Als Verweis auf eine Funktionsvariable befindet es sich in einem aktiven Zustand, wenn die Funktion zurückgibt.
2). Eine Schließung ist ein Stapelbereich, in dem keine Ressourcen veröffentlicht werden, wenn eine Funktion zurückkehrt.
Einfach ausgedrückt, ermöglicht JavaScript die Verwendung interner Funktionen - dh Funktiondefinitionen und Funktionsausdrücke befinden sich im Funktionskörper einer anderen Funktion. Darüber hinaus können diese internen Funktionen auf alle lokalen Variablen, Parameter und anderen internen Funktionen zugreifen, die in der externen Funktion, in der sie sich befinden, deklariert sind. Wenn eine dieser internen Funktionen außerhalb der externen Funktion, die sie enthält, aufgerufen wird, wird ein Verschluss gebildet.
2. Verschiedene Möglichkeiten, Schließungen zu schreiben und zu verwenden
Zunächst müssen wir verstehen, dass in JS alles ein Objekt ist und eine Funktion eine Art Objekt ist. Schauen wir uns zunächst die 5 Möglichkeiten an, Schließungen zu schreiben und kurz zu verstehen, was Schließungen sind. Eine detaillierte Erklärung wird später gegeben.
// der erste Schreibmethodenfunktionskreis (r) {this.r = r; } Circle.pi = 3.14159; Circle.Prototype.Area = function () {return Circle.pi * this.r * this.r; } var c = neuer Kreis (1.0); Alarm (C.AREA ());Diese Schreibmethode ist nichts Besonderes, sie fügt der Funktion nur einige Eigenschaften hinzu.
// die zweite Art, var Circle = function () {var obj = new Object () zu schreiben; obj.pi = 3.14159; obj.area = function (r) {return this.pi * r * r; } return obj; } var c = neuer Circle (); Alarm (C.AREA (1,0));Diese Art des Schreibens soll eine Variable deklarieren und einer Variablen als Wert eine Funktion zuweisen.
// die dritte Art, var Circle = New Object () zu schreiben; Circle.pi = 3.14159; Circle.area = function (r) {return this.pi * r * r; } alert (Circle.Area (1.0));Diese Methode wird am besten verstanden, nämlich ein neues Objekt und dann Eigenschaften und Methoden zum Objekt hinzufügen.
// Die vierte Möglichkeit zum Schreiben von var circle = {"pi": 3.14159, "Bereich": Funktion (r) {return this.pi * r * r; }}; Alert (Circle.Area (1.0));Diese Methode wird häufiger verwendet und ist am bequemsten. var obj = {} soll ein leeres Objekt deklarieren.
// Die fünfte Möglichkeit zum Schreiben von var circle = new function ("this.pi = 3.14159; this.area = function (r) {return r*r*this.pi;}"); Alarm ((neuer Kreis ()). Bereich (1,0));Um ehrlich zu sein, habe ich diese Schreibmethode noch nie verwendet, also können Sie sich darauf verweisen.
Im Allgemeinen sind die oben genannten Methoden im zweiten und vierten Häufiger häufiger und Sie können nach Ihren Gewohnheiten wählen.
Der häufig verwendete Prototyp in JS erscheint im obigen Code. Wie verwendet also Prototyp? Schauen wir uns es unten an:
var dom = function () {}; Dom.show = function () {alert ("meldung anzeigen"); }; Dom.Prototype.Display = function () {alert ("Eigenschaftsnachricht"); }; dom.display (); // Fehler dom.show (); var d = new Dom (); d. -display (); d.show (); //FehlerWir deklarieren zunächst eine Variable und weisen ihnen eine Funktion zu, da in JavaScript jede Funktion eine Portotyp -Eigenschaft hat und das Objekt nicht. Fügen Sie zwei Methoden hinzu, fügen Sie den oben genannten Prototyp direkt hinzu und brechen Sie die Anrufsituation. Die Analyseergebnisse sind wie folgt:
1. Die vom Prototyp -Attribut definierte Objektmethode ist eine statische Methode und kann nur direkt mit dem Klassennamen aufgerufen werden! Darüber hinaus kann diese Variable in dieser statischen Methode nicht verwendet werden, um andere Eigenschaften des Objekts aufzurufen!
2. Die mit dem Prototyp-Attribut definierte Objektmethode ist eine nicht statische Methode und kann erst nach der Instanziierung verwendet werden! Dies kann sich auf andere Eigenschaften im Objekt selbst innerhalb der Methode beziehen!
Schauen wir uns einen anderen Code an:
var dom = function () {var name = "Standard"; this.sex = "boy"; this.success = function () {alert ("Erfolg"); }; }; Alert (Dom.Name); Alert (Dom.sex);Schauen wir uns zuerst an, was wird angezeigt? Die Antwort ist, dass beide undefiniert dargestellt werden, warum? Dies liegt daran, dass in JavaScript jede Funktion einen Umfang bildet und diese Variablen in der Funktion deklariert sind, sodass sie im Rahmen dieser Funktion sind und nach außen nicht zugänglich sind. Um auf Variablen zuzugreifen, müssen Sie neue Instanzen.
var html = {name: 'Objekt', Erfolg: function () {this.say = function () {alert ("Hallo, Welt"); }; ALERT ("OBJ SUCKER"); }};Schauen wir uns diese Schreibmethode an. Tatsächlich ist dies ein „grammatikalischer Zucker“ in JavaScript. Diese Schreibmethode entspricht:
var html = new Object (); html.name = 'Objekt'; html.success = function () {this.say = function () {alert ("Hallo, Welt"); }; ALERT ("OBJ SUCKER");Die variable HTML ist ein Objekt, keine Funktion, daher hat sie kein Prototypattribut, und seine Methoden sind alle öffentlichen Methoden, und HTML kann nicht instanziiert werden. Andernfalls wird der folgende Fehler angezeigt:
Es kann jedoch anderen Variablen als Wert zugewiesen werden, wie z. B. var o = html; Wir können es so verwenden:
Alert (html.name);
html.success ();
Apropos, ist es vorbei? Sorgfältige Personen können sich fragen, wie Sie auf die Erfolgsmethode in der Erfolgsmethode zugreifen können. Ist es html.success.say ()?
Natürlich nicht. Wie oben erwähnt, kann aufgrund von Umfangsbeschränkungen nicht zugegriffen werden. Sie müssen also mit der folgenden Methode darauf zugreifen:
var
In Bezug auf den Umfang von JavaScript kann er nicht in einem oder zwei Satzen klar erklärt werden. Wenn Sie interessiert sind, finden Sie online einige Informationen.
2. Der Zweck von JavaScript -Schließungen
Durch die Verwendung von Schließungen können wir viele Dinge tun. Simulieren Sie beispielsweise den objektorientierten Codestil. ausdrücken Code eleganter und präzise; und Verbesserung der Code -Ausführungseffizienz in einigen Aspekten.
1. Anonyme Selbstausnahmefunktion
Wir wissen, dass, wenn nicht alle Variablen mit dem Schlüsselwort var hinzugefügt werden, der Standardwert zu den Eigenschaften des globalen Objekts hinzugefügt wird. Das Hinzufügen solcher temporären Variablen zum globalen Objekt gibt es viele Nachteile.
Zum Beispiel: Andere Funktionen können diese Variablen missbrauchen; Das globale Objekt ist zu groß und beeinflusst die Zugangsgeschwindigkeit (da der Wert der Variablen aus der Prototypkette durchquert werden muss).
Zusätzlich zur Verwendung des VAR -Schlüsselworts jedes Mal, wenn wir die Variable verwenden, begegnen wir häufig auf eine Situation, in der einige Funktionen nur einmal ausgeführt werden müssen und ihre internen Variablen nicht beibehalten werden müssen, wie z. B. die Initialisierung der Benutzeroberfläche, damit wir Schließungen verwenden können:
var data = {Tabelle: [], Baum: {}}; (Funktion (dm) {für (var i = 0; i <dm.table.rows; i ++) {var row = dm.table.rows [i]; für (var j = 0; j <row.cells; i ++) {drawcell (i, j);}}}) (Daten);Wir erstellen eine anonyme Funktion und führen sie sofort aus. Da das Externe nicht auf die darin enthaltenen Variablen verweisen kann, wird die Ressource unmittelbar nach der Ausführung der Funktion veröffentlicht. Der Schlüssel ist nicht, das globale Objekt zu verschmutzen.
2. Ergebniscache
Wir werden viele Situationen in der Entwicklung begegnen. Stellen Sie sich vor, wir haben ein sehr zeitaufwändiges Funktionsobjekt, das die Verarbeitung jeder Aufruf lange dauert.
Dann müssen wir den berechneten Wert speichern. Beim Aufrufen dieser Funktion suchen wir zuerst im Cache nach. Wenn es nicht gefunden werden kann, werden wir es berechnen, dann den Cache aktualisieren und den Wert zurückgeben. Wenn es gefunden wird, können wir den gefundenen Wert direkt zurückgeben. Verschlüsse tun genau dies, da es keine externen Referenzen freigibt, so dass die Werte innerhalb der Funktion erhalten bleiben können.
var cachedSearchbox = (function () {var cache = {}, count = []; return {Attachsearchbox: function (dsid) {if (dsid im cache) {// Wenn das Ergebnis das Ergebnis im cache return cache [dsid]; // return das Objekt im cache direkt} var fsb = new uikit.wEBcl./thsb = new uikit) uikit. cache [dsid] = fsb; // cache if (count.Length> 100) {// Sicherheits -Cache -Größe <= 100 cache [count.shift ()]; CachedSearchbox.attachSearchbox ("input");Auf diese Weise werden wir das Objekt beim zweiten Anruf aus dem Cache lesen.
3. Verpackung
var person = function () {// Der Umfang der Variablen befindet sich innerhalb der Funktion, und auf den VAR -Namen kann nicht außerhalb zugegriffen werden. var name = "Standard"; return {getName: function () {return name; }, setName: function (newname) {name = newName; }}} (); print (person.name); // direkt zugreifen, das Ergebnis ist undefined Print (person.getName ()); Person.SetName ("Abruzzi"); print (person.getName ());Die Ergebnisse sind wie folgt:
undefiniert
Standard
Abruzzi
4. Implementieren Sie Klassen und Vererbung
Funktion person () {var name = "Standard"; return {getName: function () {return name; }, setName: function (newname) {name = newName; }}}; var p = neue Person (); P.SetName ("Tom"); alert (p.getName ()); var jack = function () {}; // von Person Jack.Prototype = new Person () erbelt; // private Methode hinzufügen Jack.Prototype.say = function () {alert ("Hallo, mein Name ist Jack"); }; var j = neuer Jack (); J.SetName ("Jack"); j.say (); Alert (J.GetName ());Wir definieren Person, es ist wie eine Klasse, wir haben neue Ein -Personen -Objekte, auf ihre Methode zugreifen.
Im Folgenden definieren wir Jack, erben Person und fügen unsere eigenen Methoden hinzu.
Persönliche Zusammenfassung:
Früher dachte ich, dass JavaScript nur ein Zweig von Java war, eine Skriptsprache, und es war leicht zu lernen, aber jetzt finde ich, dass es wirklich viele Dinge zu lernen gibt. JavaScript ist viel mächtiger als wir dachten.
Das obige ist der gesamte Inhalt dieses Artikels. Ich hoffe, es wird für das Lernen aller hilfreich sein und ich hoffe, jeder wird Wulin.com mehr unterstützen.