Parsen von JavaScript-Abschlüssen (mit Code)

Der Inhalt dieses Artikels befasst sich mit der Analyse von JavaScript-Abschlüssen (mit Code). Freunde in Not können darauf verweisen.

Ein Abschluss ist eine Funktion, die Zugriff auf eine Variable im Gültigkeitsbereich einer anderen Funktion hat. Eine übliche Methode zum Erstellen eines Abschlusses besteht darin, eine Funktion innerhalb einer anderen Funktion zu erstellen. Bevor Sie Abschlüsse verstehen, müssen Sie zunächst den Variablenbereich

Variablenbereich verstehen: globale Variablen und lokale Variablen
1. Globale Variablen
werden direkt im globalen definiert Geltungsbereich Die Variable

var name='Fakin';
function getName(){
  alert(name)
}
getName()//'Fakin'

und die Funktion können die globale Variable

2 direkt lesen. Die lokale Variable
ist eine Variable, die direkt innerhalb der Funktion definiert ist (vor ES6 hatte JS keinen Block -Level-Bereich. )

function getName(){
  var name='Fakin';
}
alert(name)//undefined

Abschluss
Nachdem wir diese beiden Dinge herausgefunden haben, schauen wir uns an, was ein Abschluss ist!

Frage 1: Was ist ein Abschluss? Es wurden viele Dinge oben erwähnt, aber ich kann es nicht verstehen?
Antwort: Mein persönliches Verständnis von Schließung ist eine Funktion, die die internen Variablen anderer Funktionen lesen kann

Frage 2: Wie man Schließungen verwendet
Antwort: Erstellen Sie eine Funktion innerhalb einer Funktion, und zwar in dieser Funktion Referenzieren Sie die Variablen der vorherigen Funktion und sprechen Sie abschließend über die Rückgabe dieser Funktion. Hier ist ein Beispiel.

function f1(){
　　　　var n=999;
　　　　nAdd=function(){n+=1}
　　　　function f2(){
　　　　　　alert(n);
　　　　}
　　　　return f2;
　　}
　　var result=f1();
　　result(); // 999
　　nAdd();
　　result(); // 1000

Im obigen Beispiel ist f2 die Abschlussfunktion wird in f1 zurückgegeben und schließlich wird f1 dem Ergebnis zugewiesen, das Ergebnis wurde zweimal ausgeführt und das Ergebnis war das, was wir wollten, was bewies, dass f2 im Abschluss die Variable „n“ von f1 zitierte, „n“ jedoch nicht existierte Denn nachdem f1 ausgeführt wurde, wird es im Speicher zerstört. Jeder sollte wissen, dass in JS eine Variable automatisch zerstört wird, wenn an anderen Stellen nach der Ausführung der Funktion nicht auf sie verwiesen wird.

Dinge, die bei der Verwendung von Abschlüssen zu beachten sind

1: Da Abschlüsse dazu führen, dass die Variablen in der Funktion im Speicher gespeichert werden, ist die Speichernutzung groß Ursache Rendering friert ein usw., der Browser läuft langsam, und es kann auch zu Speicherverlusten und anderen Problemen im IE-Browser kommen
2: Da die untergeordnete Funktion im Abschluss auf die Variablen der übergeordneten Funktion verweist, wird die untergeordnete Funktion geändert Bitte ändern Sie den Wert der übergeordneten Funktionsvariablen nicht nach Belieben

Denkfragen

function count() {
    var arr = [];
    for (var i=1; i<=3; i++) {
        arr.push(function () {
            return i * i;
        });
    }
    return arr;
}

var results = count();
var f1 = results[0];
var f2 = results[1];
var f3 = results[2];
f1(); // 16
f2(); // 16
f3(); // 16

Warum geben f1 f2 f3 alle den gleichen Wert zurück? nicht das, was wir wollen? Wie kann es also nicht mit Schließung gelöst werden?
Eigentlich ist es ganz einfach, wir brauchen nur zwei weitere Codezeilen für den Abschluss

function count() {
    var arr = [];
    for (var i=1; i<=3; i++) {
        arr.push((function (n) {
            return function () {
                return n * n;
            }
        })(i));
       //在自执行函数中把i传入相当于这个自执行函数的参数绑定了i，
       //当每次循环的时候不管变量怎么更改，这个函数的参数不会更改，所以返回咱们想要的结果
    }
    return arr;
}

var results = count();
var f1 = results[0];
var f2 = results[1];
var f3 = results[2];

f1(); // 1
f2(); // 4
f3(); // 9

Das obige ist der detaillierte Inhalt vonParsen von JavaScript-Abschlüssen (mit Code). Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!