Eine ausführliche Diskussion der anonymen JavaScript-Funktionen und der Kenntnisse von „closures_javascript'.

1. Anonyme Funktion
Funktionen sind die flexibelsten Objekte in JavaScript. Hier erklären wir nur die Verwendung anonymer Funktionen. Anonyme Funktion: Es handelt sich um eine Funktion ohne Funktionsnamen.

1.1 Definition der Funktion: Stellen Sie zunächst kurz die Definition der Funktion vor, die grob in drei Arten unterteilt werden kann

Der erste Typ: Dies ist auch der häufigste Typ

Code kopieren Der Code lautet wie folgt:

Funktion double(x){
Rückgabe 2 * x;
}

Zweite Methode: Diese Methode verwendet den Funktionskonstruktor und behandelt sowohl die Parameterliste als auch den Funktionskörper als Zeichenfolgen. Dies ist sehr unpraktisch und wird nicht empfohlen.

Code kopieren Der Code lautet wie folgt:

var double = new Function('x', 'return 2 * x;');

Dritter Typ:

var double = function(x) { return 2* x; Beachten Sie, dass die Funktion auf der rechten Seite von „=" eine anonyme Funktion ist. Nach dem Erstellen der Funktion wird die Funktion der Variablen quadrat zugewiesen.

1.2 Erstellung anonymer Funktionen

Die erste Methode besteht darin, die oben erwähnte Quadratfunktion zu definieren, was auch eine der am häufigsten verwendeten Methoden ist.

Der zweite Weg:

Code kopieren Der Code lautet wie folgt:

(Funktion(x, y){
alarm(x y);
})(2, 3);

Hier wird eine anonyme Funktion erstellt (innerhalb der ersten Klammer), und die zweite Klammer wird verwendet, um die anonyme Funktion aufzurufen und die Parameter zu übergeben.

2. Schließung

Das englische Wort für „Closure“ ist „Closure“ und ist ein sehr wichtiger Teil der JavaScript-Kenntnisse, da die Verwendung von „Closures“ die Menge unseres Codes erheblich reduzieren, unseren Code klarer aussehen lassen usw. Kurz gesagt, es ist sehr leistungsfähig.

Die Bedeutung des Abschlusses: Um es ganz klar auszudrücken: Der Abschluss ist die Verschachtelung von Funktionen. Die innere Funktion kann alle Variablen der äußeren Funktion verwenden, auch wenn die äußere Funktion ausgeführt wurde (dies beinhaltet die JavaScript-Bereichskette).

Beispiel 1

Code kopieren Der Code lautet wie folgt:

Funktion checkClosure(){
var str = 'rain-man';
setTimeout(
           function(){ warning(str); } //Dies ist eine anonyme Funktion
, 2000);
}
checkClosure();

Dieses Beispiel sieht nach einer sorgfältigen Analyse des Ausführungsprozesses immer noch sehr einfach aus: Die Ausführung der checkClosure-Funktion erfolgt augenblicklich (vielleicht dauert sie nur 0,00001 Millisekunden) und im Funktionskörper wird eine Variable str erstellt von checkClosure wird str nicht freigegeben, nachdem checkClosure ausgeführt wurde, da die anonyme Funktion in setTimeout einen Verweis auf str hat. Nach 2 Sekunden wird die anonyme Funktion im Funktionskörper ausgeführt und str freigegeben.

Beispiel 2, optimierter Code

Code kopieren Der Code lautet wie folgt:

Funktion forTimeout(x, y){
alarm(x y);
}
Funktionsverzögerung(x, y, Zeit){
setTimeout('forTimeout(' x ',' y ')' , time); }
/**
* Die obige Verzögerungsfunktion ist sehr schwer zu lesen und nicht einfach zu schreiben, aber wenn Sie Abschlüsse verwenden, kann der Code klarer gemacht werden
* Funktionsverzögerung(x, y, Zeit){
* setTimeout(
* function(){
* forTimeout(x, y)
*                                                                                     * , Zeit);
* }
​*/



3. Beispiel

Die größte Verwendung anonymer Funktionen besteht darin, Abschlüsse zu erstellen (eine der Funktionen der JavaScript-Sprache) und kann auch Namespaces erstellen, um die Verwendung globaler Variablen zu reduzieren.

Beispiel 3:

Code kopieren Der Code lautet wie folgt:

var oEvent = {};
(function(){
var addEvent = function(){ /*Code-Implementierung weggelassen*/ };
Funktion removeEvent(){}

oEvent.addEvent = addEvent;
oEvent.removeEvent = removeEvent;
})();

In diesem Code sind die Funktionen addEvent und removeEvent lokale Variablen, wir können sie jedoch über die globale Variable oEvent verwenden, wodurch die Verwendung globaler Variablen erheblich reduziert und die Sicherheit der Webseite erhöht wird. Wir möchten diesen Code verwenden: oEvent.addEvent(document.getElementById('box') , 'click' , function(){});

Beispiel 4:

Code kopieren Der Code lautet wie folgt:

var rainman = (function(x , y){
Rückgabe x y;
})(2, 3);
/**
* kann auch in der folgenden Form geschrieben werden, da die erste Klammer uns nur beim Lesen hilft, das folgende Schreibformat wird jedoch nicht empfohlen.
* var rainman = function(x, y){
* x y zurückgeben;
* }(2, 3);
​*/

Hier erstellen wir eine Variable „rainman“ und initialisieren sie auf 5, indem wir die anonyme Funktion direkt aufrufen. Dieser kleine Trick ist manchmal sehr praktisch.

Beispiel 5:

Code kopieren Der Code lautet wie folgt:

var äußere = null;
(function(){
var eins = 1;
Funktion inner (){
         eins = 1;
alarm(one);
}
außen = innen;
})();
äußere(); //2
äußere(); //3
äußere(); //4

Die Variable eins in diesem Code ist eine lokale Variable (da sie innerhalb einer Funktion definiert ist) und daher von außen nicht zugänglich. Aber hier haben wir die innere Funktion erstellt, die auf die Variable eins zugreifen kann, und die globale Variable äußere bezieht sich auf inner, sodass ein dreimaliger Aufruf von äußere das inkrementelle Ergebnis anzeigt.

4. Achtung
4.1 Durch den Abschluss kann die innere Funktion auf die Variable in der übergeordneten Funktion verweisen, die Variable ist jedoch der Endwert

Beispiel 6:

Code kopieren Der Code lautet wie folgt:

/**
 *
 *

 *    
• one

 *    
• zwei

 *    
• drei

 *    
• one

 *

 */

var labels = document.getElementsByTagName('li');
for(var i = 0 , len = issues.length ; i < len ; i ){
Listen[ i ].onmouseover = function(){
alarm(i);
};
}

Sie werden feststellen, dass beim Bewegen der Maus über jedes

Lösung 1:

Code kopieren Der Code lautet wie folgt:

var list = document.getElementsByTagName('li');
for(var i = 0 , len = issues.length ; i < len ; i ){
(Funktion(Index){
Lists[index].onmouseover = function(){
Warnung(Index);
                                                                   })(i);
}

Lösung 2:

Code kopieren Der Code lautet wie folgt:

var list = document.getElementsByTagName('li');
for(var i = 0, len = issues.length; i < len; i ){
Lists[ i ].$$index = i; //Zeichnen Sie den Index auf, indem Sie das Attribut $$index an das Dom-Element binden
Listen[ i ].onmouseover = function(){
warning(this.$$index);
};
}

Lösung drei:

Code kopieren Der Code lautet wie folgt:

Funktion eventListener(list, index){
List.onmouseover = function(){
alarm(index);
};
}
var list = document.getElementsByTagName('li');
for(var i = 0 , len = issues.length ; i < len ; i ){
EventListener(lists[ i ] , i);
}

4.2 Speicherverlust

Die Verwendung von Schließungen kann leicht zu Speicherverlusten im Browser führen. Bei Interesse können Sie sich an folgende Adresse wenden: http://www.jb51.net/article/57404. htm