Hauptinhalt:
1. Analysieren Sie die Bedeutung des lexikalischen Bereichs von JavaScript
2. Analysieren Sie die Bereichskette der Variablen
3. Was passiert, wenn Variablennamen heraufgestuft werden?
Kürzlich habe ich JavaScript-Kurse im Chuanzhi Podcast erklärt. Viele Freunde fanden JavaScript so einfach, wussten aber nicht, wie man es verwendet, also habe ich einige Inhalte vorbereitet, die ich mit Ihnen teilen möchte.
In dieser Serie werden hauptsächlich die fortgeschrittenen Teile von JavaScript erläutert, einschließlich Bereichsketten, Abschlüsse, Funktionsaufrufmuster, Prototypen und objektorientierte Dinge. Wenn Sie die Grundlagen kennen müssen, können die Schüler auf http gehen : Gehen Sie zu //net.itcast.cn, um kostenlose Lernvideos herunterzuladen. Kommen wir also ohne Umschweife direkt zu unserem Thema.
1. Über den Bereich auf Blockebene
Apropos Variablenbereich von JavaScript: Er unterscheidet sich von der C-ähnlichen Sprache, die wir normalerweise verwenden.
Beispielsweise der folgende Code in C#:
Kopieren Sie den Codecode wie folgt:
static void Main(string[] args)
{
wenn(wahr)
{
int num = 10;
}
System.Console.WriteLine(num);
}
Wenn dieser Code kompiliert wird, wird er nicht übergeben, da „der Name num im aktuellen Kontext nicht existiert“.
Der Gültigkeitsbereich von Variablen wird durch geschweifte Klammern begrenzt und wird als Gültigkeitsbereich auf Blockebene bezeichnet.
Im Bereich auf Blockebene liegen alle Variablen innerhalb der geschweiften Klammern der Definition, vom Anfang der Definition bis zum Ende der geschweiften Klammern.
Es kann innerhalb des Bereichs verwendet werden. Es kann nicht außerhalb dieses Bereichs zugegriffen werden
Kopieren Sie den Codecode wie folgt:
wenn(wahr)
{
int num = 10;
System.Console.WriteLine(num);
}
Sie ist hier zugänglich, da die Variable in denselben geschweiften Klammern definiert und verwendet wird.
In JavaScript ist das jedoch anders. In JavaScript gibt es kein Konzept für den Gültigkeitsbereich auf Blockebene.
2. Umfang in JavaScript
In JavaScript der folgende Code:
Kopieren Sie den Codecode wie folgt:
if(true) {
Varnum = 10;
}
alarm(num);
Das Ergebnis der Operation ist ein Popup-Fenster 10. Wie wird also der Umfang von Variablen in JavaScript begrenzt?
2.1 Funktion begrenzt den Variablenumfang
In JavaScript können nur Funktionen den Umfang einer Variablen einschränken. Was bedeutet das?
Das heißt, in JavaScript kann auf innerhalb einer Funktion definierte Variablen innerhalb der Funktion zugegriffen werden, jedoch außerhalb der Funktion
Zugriff nicht möglich. Siehe folgenden Code:
Kopieren Sie den Codecode wie folgt:
var func = function() {
Varnum = 10;
};
versuchen {
alarm(num);
} fangen ( e ) {
Warnung(e);
}
Wenn dieser Code ausgeführt wird, wird eine Ausnahme ausgelöst und die Variable num ist nicht definiert. Mit anderen Worten, die in der Funktion definierte Variable kann nicht definiert werden
Wenn es außerhalb der Funktion verwendet wird, kann es natürlich auch vor der Zuweisung frei innerhalb der Funktion verwendet werden. Siehe den folgenden Code:
Kopieren Sie den Codecode wie folgt:
var func = function() {
alarm(num);
Varnum = 10;
alarm(num);
};
versuchen {
func();
} fangen ( e ) {
Warnung(e);
}
Nachdem dieser Code ausgeführt wurde, wird kein Fehler ausgegeben und das Popup-Fenster wird zweimal angezeigt, nämlich undefiniert und 10 (den Grund dafür erkläre ich weiter unten).
Daraus ist ersichtlich, dass auf Variablen nur innerhalb einer Funktion zugegriffen werden kann. Ebenso kann auf Funktionen innerhalb der Funktion zugegriffen werden.
2.2 Subdomain greift auf übergeordnete Domain zu
Wie bereits erwähnt, kann eine Funktion den Bereich einer Variablen einschränken, sodass die Funktion in der Funktion zu einer Unterdomäne des Bereichs in der Unterdomäne wird
Der Code in kann auf Variablen in der übergeordneten Domäne zugreifen. Siehe den folgenden Code:
Kopieren Sie den Codecode wie folgt:
var func = function() {
Varnum = 10;
var sub_func = function() {
alarm(num);
};
sub_func();
};
func();
Das Ergebnis der Ausführung dieses Codes ist 10. Sie können den oben erwähnten Variablenzugriff sehen, wenn Sie jedoch auf die übergeordnete Domäne in der untergeordneten Domäne zugreifen
Der Code ist auch bedingt. Wie der folgende Code:
Kopieren Sie den Codecode wie folgt:
var func = function() {
Varnum = 10;
var sub_func = function() {
Varnum = 20;
alarm(num);
};
sub_func();
};
func();
Dieser Code hat ein „var num = 20;“ mehr als zuvor. Dieser Code befindet sich in der Subdomain, sodass die Subdomain auf die übergeordnete Domain zugreift.
Es gab eine Änderung, das von diesem Code ausgegebene Ergebnis ist 20. Das heißt, die Anzahl, auf die die Subdomäne zu diesem Zeitpunkt zugreift, ist eine Variable in der Subdomäne und nicht in der übergeordneten Domäne.
Es ist ersichtlich, dass es bei der Verwendung von Variablen in JavaScript bestimmte Regeln gibt, zunächst der JavaScript-Interpreter
Durchsuchen Sie die Benutzerdomäne, um festzustellen, ob eine Definition der Variablen vorhanden ist. Wenn nicht, suchen Sie nach der Variablen in der übergeordneten Domäne.
Analog dazu wird die Ausnahme „Variable ist nicht definiert“ ausgelöst, bis der Bereich der obersten Ebene immer noch nicht gefunden wird. Siehe den folgenden Code:
Kopieren Sie den Codecode wie folgt:
(Funktion() {
Varnum = 10;
(Funktion() {
Varnum = 20;
(Funktion(){
alarm(num);
})()
})();
})();
Nachdem dieser Code ausgeführt wurde, wird 20 gedruckt, wenn „var num = 20;“ entfernt wird
„var num = 10“, dann tritt ein undefinierter Fehler auf.
3. Scope-Kette
Durch die Unterteilung von JavaScript-Bereichen können JavaScript-Zugriffsbereiche zu einer verketteten Baumstruktur verbunden werden.
Sobald die Bereichskette von JavaScript klar verstanden werden kann, sind die Variablen und Abschlüsse von JavaScript sehr klar.
Die folgende Methode verwendet das Zeichnen, um die Bereichskette zu zeichnen.
3.1 Zeichenregeln:
1) Die Bereichskette ist ein Array von Objekten
2) Alle Skripte sind Ketten der Ebene 0, jedes Objekt nimmt eine Position ein
3) Wenn Sie sehen, dass sich eine Funktion in eine Kette erstreckt, erweitern Sie sie Ebene für Ebene.
4) Schauen Sie sich beim Zugriff zunächst die aktuelle Funktion an. Wenn diese nicht definiert ist, überprüfen Sie die Kette.
5) Wiederholen Sie dies bis zur Kette der Stufe 0
3.2 Beispiele
Schauen Sie sich den folgenden Code an:
Kopieren Sie den Codecode wie folgt:
Varnum = 10;
var func1 = function() {
Varnum = 20;
var func2 = function() {
Varnum = 30;
alarm(num);
};
func2();
};
var func2 = function() {
Varnum = 20;
var func3 = function() {
alarm(num);
};
func3();
};
func1();
func2();
Lassen Sie uns diesen Code analysieren:
-> Erstens ist der gesamte Code ein globaler Bereich und kann als Bereichskette der Ebene 0 markiert werden. Dann gibt es ein Array
var link_0 = [num, func1, func2];//Hier mit Pseudocode beschrieben
-> Hier sind func1 und func2 beide Funktionen, sodass zwei Bereichsketten der Ebene 1 abgeleitet werden, nämlich
var link_1 = { func1: [ num, func2 ] }; // Hier mit Pseudocode beschrieben
var link_1 = { func2: [ num, func3 ] }; // Hier mit Pseudocode beschrieben
-> Die erste Kette der Ebene 1 leitet sich von der Kette der Ebene 2 ab
var link_2 = { func2: [ num ] }; // Hier mit Pseudocode beschrieben
-> Für die Kette der zweiten Ebene 1 sind keine Variablen definiert und es handelt sich um eine leere Kette, die ausgedrückt wird als
var link_2 = { func3: [ ] };
-> Durch die Integration des obigen Codes kann die Bereichskette wie folgt ausgedrückt werden:
Kopieren Sie den Codecode wie folgt:
//Hier mit Pseudocode beschrieben
var link = [ // Level-0-Kette
num,
{ func1 : [ // Die erste Kette der Ebene 1
num,
{ func2 : [ // Level-2-Kette
Num
] }
]},
{ func2 : [ // Die zweite Kette der Ebene 1
num,
{ func3 : [] }
]}
];
-> Als Bild dargestellt als
Abbildung: 01_01 Scope Chain.bmp
Hinweis: Verwenden Sie js-Code, um das Kettendiagramm auszudrücken. Wenn es hervorgehoben wird, ist es sehr klar.
Anhand dieses Bereichskettendiagramms können Sie klar verstehen, wie auf Variablen zugegriffen wird:
Wenn Sie eine Variable verwenden müssen, suchen Sie zuerst nach der Variablen in der aktuellen Kette. Wenn Sie sie finden, verwenden Sie sie direkt
Suchen Sie nach oben; wenn nicht gefunden, durchsuchen Sie die Bereichskette auf einer Ebene bis zur Bereichskette auf Ebene 0.
Wenn Sie die Ebene der Bereichskette, zu der eine Variable gehört, sehr eindeutig bestimmen können, dann bei der Analyse von JavaScript
Es ist sehr einfach, wenn es um das Codieren und die Verwendung erweiterter JavaScript-Funktionen wie Schließungen geht (zumindest für mich).
3. Förderung von Variablennamen und Förderung von Funktionsnamen
Bei Bereichsketten und Variablenzugriffsregeln gibt es ein sehr heikles Problem. Schauen wir uns zunächst das Folgende an
JavaScript-Code:
Kopieren Sie den Codecode wie folgt:
Varnum = 10;
var func = function() {
alarm(num);
Varnum = 20;
alarm(num);
};
func();
Was wird das Ergebnis der Hinrichtung sein? Sie können darüber nachdenken, ich werde die Antwort noch nicht verraten.
Lassen Sie uns zunächst diesen Code analysieren.
In diesem Code gibt es eine Bereichskette der Ebene 0, die die Mitglieder num und func enthält. Unter func gibt es eine Funktion der Ebene 1.
Daher wird beim Aufruf der Funktion func erkannt, dass die Domänenkette im aktuellen Bereich liegt
Die Variable num wurde definiert, daher wird dieser Variable aufgrund des Codes derzeit kein Wert zugewiesen
Der Code läuft von oben nach unten. Daher ist der erste Ausdruck undefiniert und der zweite Ausdruck ist 20.
Hast du es richtig gemacht?
In JavaScript ist es auch üblich, Code hinten zu definieren und ihn vorne so zu verwenden
Frage: Zu diesem Zeitpunkt ist es so, als ob die Variable am Anfang definiert worden wäre, und das Ergebnis ist wie der folgende Code:
Kopieren Sie den Codecode wie folgt:
Varnum = 10;
var func = function() {
var num;// Es fühlt sich an, als ob es hier definiert wurde, aber es gibt keine Zuweisung.
alarm(num);
Varnum = 20;
alarm(num);
};
func();
Dieses Phänomen wird oft als Variablennamen-Promotion bezeichnet. Es gibt beispielsweise auch den folgenden Code:
Kopieren Sie den Codecode wie folgt:
var func = function() {
Alert("Externe Funktion aufrufen");
};
var foo = function() {
func();
var func = function() {
Alert("Interne Funktion aufrufen");
};
func();
};
Okay, wie sieht dieser Code aus? Oder es sollte etwas anderes sein, ich überlasse es nicht den Lesern, darüber nachzudenken!
Die Antwort gebe ich im nächsten Artikel.
Aufgrund dieser Unterschiede wird während der eigentlichen Entwicklung empfohlen, alle Variablen zu Beginn zu schreiben.
Das heißt, die Variablen werden am Anfang der Funktion definiert, ähnlich wie in der C-Sprache. Dies gilt auch für js-Bibliotheken.
Dies geschieht beispielsweise mit jQuery usw.
4. Zusammenfassung
Okay, in diesem Artikel wird hauptsächlich erklärt, worum es beim lexikalischen Geltungsbereich von JavaScript geht, und wie er erklärt wird.
Wie analysiert man die Bereichskette und den Zugriffsstatus von Variablen? Lassen Sie uns mit einer weiteren Übung abschließen! ! !
Sehen Sie, was das Ergebnis der Ausführung des folgenden Codes ist:
Kopieren Sie den Codecode wie folgt:
if( ! "a" im Fenster ) {
var a = "Variable definieren";
}
Warnung(a);