Empfohlenes kostenloses Lernen: Javascript-Lern-Tutorial
1. Was ist JavaScript? 1-1. JavaScript-Implementierung. Obwohl JavaScript und ECMAScript im Wesentlichen vorhanden sind Synonyme, aber JavaScript ist weit mehr als das, was ECMA-262 definiert. Die vollständige JavaScript-Implementierung enthält:
Core (ECMAScript) Document Object Model (DOM)
Browser Object Model (BOM)
1-2, DOM
Das Document Object Model (DOM, Document Object Model) ist eine Anwendungsprogrammierschnittstelle (API) zur Verwendung von erweitertem XML in HTML. DOM abstrahiert die gesamte Seite in eine Reihe hierarchischer Knoten. Jede Komponente einer HTML- oder XML-Seite ist ein Knoten, der unterschiedliche Daten enthält. Mit
DOM können Entwickler den Inhalt und die Struktur von Webseiten nach ihren Wünschen steuern, indem sie einen Baum erstellen, der das Dokument darstellt. Mithilfe der DOM-API können Knoten einfach gelöscht, hinzugefügt, ersetzt und geändert werden.
1-3, BOM
IE3 und Netscape Navigator 3 stellen die
Browser Object Model
Normalerweise werden alle browserspezifischen Erweiterungen in den BOM-Bereich einbezogen. Hier sind einige solcher Erweiterungen:
Die Möglichkeit, ein neues Browserfenster zu öffnen;Navigatorobjekt, das detaillierte Informationen über den Browser bereitstellt; , das detaillierte Informationen über die vom Browser geladene Seite bereitstellt;
Bildschirmobjekt, das detaillierte Informationen über die Bildschirmauflösung des Benutzers bereitstellt;
Leistungsobjekt, das detaillierte Informationen über die Speichernutzung des Browsers, das Navigationsverhalten und die Zeitstatistik bereitstellt;
script-Elementasync: Optional. Gibt an, dass der Download des Skripts sofort beginnen soll, andere Seitenaktionen wie das Herunterladen von Ressourcen oder das Warten auf das Laden anderer Skripts können jedoch nicht verhindert werden. Nur gültig für externe Skriptdateien. Zeichensatz: optional. Verwenden Sie den durch das src-Attribut angegebenen Codezeichensatz. Dieses Attribut wird selten verwendet, da die meisten Browser sich nicht um seinen Wert kümmern.
script元素
将JavaScript插入HTML的主要方法是使用 script 元素。这
个元素是由网景公司创造出来，并最早在Netscape Navigator 2中实现
的。后来，这个元素被正式加入到HTML规范。 script 元素有下
列8个属性。
asynccrossorigin: Optional. Konfigurieren Sie CORS-Einstellungen (Cross-Origin Resource Sharing) für verwandte Anforderungen. CORS wird standardmäßig nicht verwendet. crossorigin="anonymous" Profilanfragen müssen das Anmeldeinformations-Flag nicht setzen. crossorigin="use-credentials" setzt das Anmeldeinformations-Flag, was bedeutet, dass ausgehende Anfragen Anmeldeinformationen enthalten.
aufschieben: Optional. Dies bedeutet, dass es kein Problem bei der Ausführung des Skripts gibt, nachdem die Analyse und Anzeige des Dokuments abgeschlossen ist. Nur gültig für externe Skriptdateien. In IE7 und früheren Versionen kann dieses Attribut auch für Inline-Skripte angegeben werden.
Integrität: Optional. Ermöglicht den Vergleich empfangener Ressourcen mit angegebenen kryptografischen Signaturen zur Überprüfung der Subressourcenintegrität (SRI). Wenn die Signatur der empfangenen Ressource nicht mit der durch dieses Attribut angegebenen Signatur übereinstimmt, meldet die Seite einen Fehler und das Skript wird nicht ausgeführt. Mit diesem Attribut kann sichergestellt werden, dass ein Content Delivery Network (CDN) keine schädlichen Inhalte bereitstellt.
src: Optional. Stellt eine externe Datei dar, die auszuführenden Code enthält.
Typ: Optional. Stellt anstelle von language den Inhaltstyp (auch MIME-Typ genannt) der Skriptsprache im Codeblock dar.
Der im Skript enthaltene Code wird von oben nach unten interpretiert
2-2,
Das Skriptelement, das das src-Attribut verwendet, sollte keinen anderen JavaScript-Code mehr in den Skript- und /script-Tags enthalten. Wenn beides bereitgestellt wird, lädt der Browser einfach die Skriptdatei herunter und führt sie aus, wobei der Inline-Code ignoriert wird.
Eine der mächtigsten und umstrittensten Funktionen des Skriptelements ist, dass es JavaScript-Dateien von externen Domänen enthalten kann. Ähnlich wie das img-Element kann das src-Attribut des script-Elements eine vollständige URL sein, und die Ressource, auf die diese URL verweist, darf sich nicht in derselben Domäne befinden wie die HTML-Seite, die sie enthält
2-3, Dokumentmodus
kann verwendet werden, um den Dokumentmodus umzuschalten. Es gibt zwei anfängliche Dokumentmodi: gemischter Modus (Mackenmodus) und Standardmodus (Standardmodus). Ersteres sorgt dafür, dass der IE dem IE5 ähnelt (unterstützt einige nicht standardmäßige Funktionen), und der zweite sorgt dafür, dass sich der IE standardkonform verhält. Obwohl der Hauptunterschied zwischen den beiden Modi nur im über CSS gerenderten Inhalt besteht, gibt es auch einige damit verbundene Auswirkungen oder Nebenwirkungen auf JavaScript. Diese Nebenwirkungen werden in diesem Buch häufig erwähnt.
Nachdem der IE erstmals die Umschaltung des Dokumentmodus unterstützte, folgten auch andere Browser diesem Beispiel. Mit der weit verbreiteten Implementierung von Browsern ist ein dritter Dokumentmodus entstanden: der Quasi-Standardmodus (fast
Standardmodus). Browser in diesem Modus unterstützen viele Standardfunktionen, sind jedoch nicht so streng wie die Standards. Der Hauptunterschied besteht darin, wie der Leerraum um Bildelemente herum behandelt wird (am auffälligsten bei der Verwendung von Bildern in Tabellen).
Der Promiscuous-Modus wird in allen Browsern aktiviert, indem die Doctype-Deklaration am Anfang des Dokuments weggelassen wird. Diese Vereinbarung ist unangemessen, da der gemischte Modus in verschiedenen Browsern sehr unterschiedlich ist und es ohne die Verwendung schwarzer Technologie grundsätzlich keine Browserkonsistenz gibt.
2-4, Noscript-Element
Angesichts des Problems, dass frühe Browser kein JavaScript unterstützen, ist eine Lösung für eine ordnungsgemäße Seitenverschlechterung erforderlich. Schließlich tauchte das Element auf und wurde verwendet, um Browsern, die kein JavaScript unterstützten, alternative Inhalte bereitzustellen. Obwohl heutige Browser JavaScript zu 100 % unterstützen, hat dieses Element immer noch seine Verwendung für Browser, die JavaScript deaktivieren. Das
-Element kann jedes HTML-Element enthalten, das in
3. Grammatikgrundlagen
3-1, Grammatik
Das erste, was Sie wissen müssen, ist, dass in ECMAScript bei allem die Groß-/Kleinschreibung beachtet wird. Unabhängig davon, ob es sich um eine Variable, einen Funktionsnamen oder einen Operator handelt, wird die Groß-/Kleinschreibung beachtet. Mit anderen Worten, der Variablentest und der Variablentest sind zwei verschiedene Variablen. Ebenso kann typeof nicht als Funktionsname verwendet werden, da es sich um ein Schlüsselwort handelt (mehr dazu später). Aber Typeof ist ein vollkommen gültiger Funktionsname.
3-2. Bezeichner
Der sogenannte Bezeichner ist der Name einer Variablen, Funktion, eines Attributs oder eines Funktionsparameters. Ein Bezeichner kann aus einem oder mehreren der folgenden Zeichen bestehen:
Die Buchstaben im Bezeichner können Buchstaben in erweiterten ASCII- oder Unicode-Alphabeten wie À und Æ sein (dies wird jedoch nicht empfohlen).
Konventionell verwenden ECMAScript-Bezeichner die Kamel-Schreibweise, d. h. der erste Buchstabe des ersten Wortes ist kleingeschrieben und der erste Buchstabe jedes nachfolgenden Wortes wird groß geschrieben
3-3, strikter Modus
ECMAScript 5 fügt strikt hinzu Modus (strenger Modus) Konzept. Der strikte Modus ist ein anderes JavaScript-Analyse- und Ausführungsmodell. Einige nicht standardmäßige Schreibmethoden von ECMAScript 3 werden in diesem Modus verarbeitet und es werden Fehler für unsichere Aktivitäten
3-4, Schlüsselwörter und reservierte Wörter
ECMA ausgegeben -262 beschreibt eine Reihe reservierter Schlüsselwörter, die spezielle Verwendungszwecke haben, z. B. die Angabe des Anfangs und Endes einer Steueranweisung oder die Ausführung einer bestimmten Operation
Alle in ECMA-262 6. Ausgabe angegebenen Schlüsselwörter:
break do in typeof case else instanceof var catch export new void class extends return while const finally super with continue for switch yield debugger function this default if throw delete import try
Die Spezifikation auch beschreibt eine Reihe zukünftiger reservierter Wörter, die auch nicht als Bezeichner oder Eigenschaftsnamen verwendet werden können. Obwohl reservierte Wörter in der Sprache keinen bestimmten Zweck haben, sind sie für die zukünftige Verwendung als Schlüsselwörter reserviert
3-5. ECMAScript-Variablen sind lose typisiert, was bedeutet, dass Variablen zum Speichern jeder Art von Daten verwendet werden können. Jede Variable ist nichts anderes als ein benannter Platzhalter, der einen beliebigen Wert enthält. Es gibt drei Schlüsselwörter zum Deklarieren von Variablen: var, const und let. Unter anderem kann var in allen Versionen von CMAScript verwendet werden, während const und let nur in ECMAScript 6 und späteren Versionen verwendet werden können
3-6, Schlüsselwort var
Var-Deklarationsumfang
Das Hauptproblem besteht darin, dass eine mit dem Var-Operator definierte Variable zu einer lokalen Variablen der Funktion wird, die sie enthält. Wenn Sie beispielsweise var verwenden, um eine Variable innerhalb einer Funktion zu definieren, bedeutet dies, dass die Variable zerstört wird, wenn die Funktion beendet wird
Var-Deklarationsförderung
Bei Verwendung von var meldet der folgende Code keinen Fehler. Dies liegt daran, dass mit diesem Schlüsselwort deklarierte Variablen automatisch an die Spitze des Funktionsbereichs heraufgestuft werden
3-7. let-Deklaration
let hat ähnliche Funktionen wie var, es gibt jedoch sehr wichtige Unterschiede. Der offensichtlichste Unterschied besteht darin, dass der Geltungsbereich von let-Deklarationen der Blockbereich ist, während der Geltungsbereich von var-Deklarationen der Funktionsbereich ist.
Temporäre Totzone
Ein weiterer wichtiger Unterschied zwischen let und var besteht darin, dass von let deklarierte Variablen im Gültigkeitsbereich nicht hochgestuft werden.
Globale Deklaration
Im Gegensatz zum Schlüsselwort var werden mit let deklarierte Variablen im globalen Bereich nicht zu Attributen des Fensterobjekts (mit var deklarierte Variablen werden)
Bedingte Deklaration
Bei Verwendung von var zum Deklarieren von Variablen Wenn die Wenn die Deklaration angehoben wird, führt die JavaScript-Engine die redundanten Deklarationen automatisch zu einer einzigen Deklaration am oberen Ende des Bereichs zusammen. Da der Gültigkeitsbereich von let ein Block ist, ist es unmöglich zu überprüfen, ob eine Variable mit demselben Namen zuvor mit let deklariert wurde, und es ist auch unmöglich, sie ohne vorherige Deklaration
let-Deklaration in der for-Schleife
zu deklarieren Wenn let erscheint, dringt die durch die for-Schleife definierte Iterationsvariable außerhalb des Schleifenkörpers ein
const-Deklaration
Das Verhalten von const ist grundsätzlich dasselbe wie let Sie müssen gleichzeitig die Variable initialisieren und versuchen, die const-Deklaration zu ändern. Variablen können Laufzeitfehler verursachen.
3-8, Deklarationsstil und Best Practices
ECMAScript 6 fügt let und const hinzu, was objektiv eine bessere Unterstützung für die Sprache bietet, um Umfang und Semantik genauer zu deklarieren. Die JavaScript-Community wird seit vielen Jahren von verschiedenen Problemen geplagt, die durch sich seltsam verhaltende Variablen verursacht werden. Mit dem Aufkommen dieser beiden neuen Schlüsselwörter entstehen nach und nach neue Best Practices, die zur Verbesserung der Codequalität beitragen.
4. Datentypen
ECMAScript verfügt über 6 einfache Datentypen (auch primitive Typen genannt): Undefiniert, Null, Boolesch, Zahl, Zeichenfolge und Symbol. Symbol (Symbol) ist neu in ECMAScript 6. Es gibt auch einen komplexen Datentyp namens Object. Objekt ist eine ungeordnete Sammlung von Name-Wert-Paaren. Da Sie in ECMAScript keine eigenen Datentypen definieren können, können alle Werte durch einen der sieben oben genannten Datentypen dargestellt werden. Nur 7 Datentypen scheinen nicht auszureichen, um alle Daten darzustellen. Die Datentypen von ECMAScript sind jedoch sehr flexibel. Da das Typsystem von ECMAScript locker ist, ist eine Methode zur Bestimmung des Datentyps erforderlich einer beliebigen Variablen. Hier kommt die Art des Operators ins Spiel. Wenn Sie den Operator „typeof“ für einen Wert verwenden, wird eine der folgenden Zeichenfolgen zurückgegeben:
„undefiniert“ bedeutet, dass der Wert undefiniert ist;„boolean“ bedeutet, dass der Wert ein Boolescher Wert ist; „ „Zahl“ bedeutet, dass der Wert ein numerischer Wert ist; „Objekt“ bedeutet, dass der Wert ein Objekt (keine Funktion) oder Null ist;
„Funktion“ bedeutet, dass der Wert eine Funktion ist; „Symbol“ bedeutet, dass der Wert ein Symbol ist.
4-2. Undefinierter Typ
Der undefinierte Typ hat nur einen Wert, nämlich den Sonderwert undefiniert. Wenn eine Variable mit var oder let deklariert, aber nicht initialisiert wird, ist dies gleichbedeutend damit, der Variablen einen undefinierten Wert zuzuweisen. Auch wenn nicht initialisierten Variablen automatisch ein undefinierter Wert zugewiesen wird, empfehlen wir dennoch, die Variable beim Deklarieren zu initialisieren. Wenn typeof „undefiniert“ zurückgibt, wissen Sie auf diese Weise, dass dies daran liegt, dass die angegebene Variable noch nicht deklariert wurde, und nicht daran, dass sie deklariert, aber nicht initialisiert wurde.
4-3. Null-Typ
Der Null-Typ hat auch nur einen Wert, nämlich den Sonderwert null . Logisch gesehen stellt der Nullwert einen Nullobjektzeiger dar, weshalb die Übergabe von Null an typeof „object“ zurückgibt. Wenn Sie eine Variable definieren, die in Zukunft einen Objektwert enthalten soll, wird empfohlen, sie mit null zu initialisieren und nicht mit andere Werte verwenden. Auf diese Weise können Sie, solange Sie prüfen, ob der Wert dieser Variablen null ist, später feststellen, ob dieser Variablen ein Verweis auf ein Objekt zugewiesen wurdeDer Vergleich von null und undefiniert mit dem Gleichheitsoperator (==) gibt immer true zurück. Beachten Sie jedoch, dass dieser Operator seine Operanden zum Vergleich umwandelt.
Obwohl null und undefiniert verwandt sind, sind ihre Verwendungen völlig unterschiedlich. Wie bereits erwähnt, müssen Sie einen Variablenwert niemals explizit auf undefiniert setzen. Aber null ist nicht so. Immer wenn eine Variable ein Objekt enthält und es kein solches Objekt zum Halten gibt, muss die Variable mit Null gefüllt werden. Dadurch wird die Semantik beibehalten, dass null ein Zeiger auf ein Nullobjekt ist, und es weiter von undefiniert unterschieden.
null ist ein falscher Wert. So kann es bei Bedarf präziser erkannt werden. Bedenken Sie jedoch, dass es viele andere mögliche Werte gibt, die ebenfalls falsch sind. Stellen Sie also sicher, dass Sie den Literalwert Null erkennen möchten und nicht nur den falschen Wert
4-4. Der Typ Boolean (Boolean) ist einer der am häufigsten verwendeten Typen in ECMAScript. Zwei Literalwerte: wahr und falsch. Diese beiden booleschen Werte unterscheiden sich von numerischen Werten, daher ist true nicht gleich 1 und false nicht gleich 0
Hinweis: Bei den booleschen Literalen true und false wird die Groß-/Kleinschreibung beachtet, daher ist True und False (und andere gemischte Werte) Fallformen) sind ein gültiger Bezeichner, aber kein boolescher Wert.4-5, Zahlentyp
Der vielleicht interessanteste Datentyp in ECMAScript ist Zahl. Der Zahlentyp stellt Ganzzahlen und Gleitkommawerte (in einigen Sprachen auch Werte mit doppelter Genauigkeit genannt) im IEEE 754-Format dar. Verschiedene numerische Typen haben auch unterschiedliche numerische Literalformate
GleitkommawertEs gibt einen speziellen Wert namens NaN, der „Keine Zahl“ (Keine Zahl) bedeutet. Er wird verwendet, um anzuzeigen, dass die Operation, die einen Wert zurückgeben sollte, fehlgeschlagen ist (). anstatt einen Fehler auszulösen).
4-7. Numerische Konvertierung
Es gibt 3 Funktionen, die nicht-numerische Werte in numerische Werte umwandeln können: Number(), parseInt() und parseFloat(). Number() ist eine Konvertierungsfunktion, die für jeden Datentyp verwendet werden kann. Die beiden letztgenannten Funktionen werden hauptsächlich zur Umwandlung von Zeichenfolgen in numerische Werte verwendet. Für die gleichen Parameter führen diese drei Funktionen unterschiedliche Operationen aus. Die Funktion Number() führt die Konvertierung basierend auf den folgenden Regeln durch. Boolescher Wert, true wird in 1 konvertiert, false wird in 0 konvertiert. Numerischer Wert, direkt zurückgegeben. null , gibt 0 zurück. undefiniert , gibt NaN zurück.
4-8. String-Typ
Der Datentyp String (String) stellt eine Folge von null oder mehr 16-Bit-Unicode-Zeichen dar. Zeichenfolgen können mit doppelten Anführungszeichen ("), einfachen Anführungszeichen (') oder Backticks (`) gekennzeichnet werden.
Zeichenliterale
Vorlagenliterale
ECMAScript 6 bietet die Möglichkeit, Vorlagenliterale zum Definieren von Zeichenfolgen zu verwenden. Im Gegensatz zur Verwendung von einfachen oder doppelten Anführungszeichen behalten Vorlagenliterale Zeilenumbruchzeichen bei und können Zeichenfolgen über Zeilen hinweg definieren
Zeichenfolgeninterpolation
Eine der am häufigsten verwendeten Funktionen von Vorlagenliteralen ist die Unterstützung der Zeichenfolgeninterpolation, d. h. sie können in a definiert werden kontinuierlich Fügen Sie einen oder mehrere Werte ein. Technisch gesehen ist ein Vorlagenliteral kein String, sondern ein spezieller JavaScript-Syntaxausdruck, das Ergebnis nach der Auswertung ist jedoch ein String. Vorlagenliterale werden sofort ausgewertet und in Zeichenfolgeninstanzen konvertiert, wenn sie definiert werden.
Vorlagenliteral-Tag-Funktionen
Vorlagenliterale unterstützen auch die Definition von Tag-Funktionen (Tag-Funktion). Das Interpolationsverhalten kann über die Tag-Funktion angepasst werden. Die Label-Funktion empfängt die durch Interpolationstokens getrennte Vorlage und das Ergebnis der Auswertung jedes Ausdrucks. Die Tag-Funktion selbst ist eine reguläre Funktion, die benutzerdefiniertes Verhalten anwendet, indem sie es dem Vorlagenliteral voranstellt,
Originalzeichenfolge
Mithilfe von Vorlagenliteralen können Sie auch direkt den Inhalt des ursprünglichen Vorlagenliterals abrufen (z. B. Zeilenumbrüche oder Unicode-Zeichen). , anstatt durch konvertierte Zeichen dargestellt zu werden. Zu diesem Zweck können Sie die Standard-Tag-Funktion String.raw verwenden
5. Operatoren
ECMA-262 beschreibt eine Reihe von Operatoren, die zur Manipulation von Datenwerten verwendet werden können, einschließlich mathematischer Operatoren (z. B. Addition, Subtraktion), bitweise Operatoren, relationale Operatoren und Gleichheitsoperatoren usw. Operatoren in ECMAScript sind insofern einzigartig, als sie für eine Vielzahl von Werten verwendet werden können, darunter Zeichenfolgen, Zahlen, boolesche Werte und sogar Objekte. Bei der Anwendung auf ein Objekt rufen Operatoren normalerweise die Methoden valueOf() und/oder toString() auf, um einen berechenbaren Wert zu erhalten. 3.5.1 Unärer Operator Ein Operator, der nur mit einem Wert arbeitet, wird als unärer Operator bezeichnet. Der unäre Operator ist der einfachste Operator in ECMAScript.
5-1. Unäre Operatoren
2 Die unären Additions- und Subtraktionsoperatoren sind für die meisten Entwickler nicht geeignet haben in ECMAScript den gleichen Zweck wie in der High-School-Mathematik. Die unäre Addition wird durch ein Pluszeichen (+) dargestellt, das vor der Variablen steht und keinen Einfluss auf den Wert hat. 5-2 Bitweise NICHT-Operator Der bitweise NICHT-Operator verwendet das Tilde-Symbol (~) bedeutet, dass seine Funktion darin besteht, das Einerkomplement des Wertes zurückzugeben. Bitweises NICHT ist einer der wenigen binären mathematischen Operatoren in ECMAScript
Bitweises UND Der bitweise UND-Operator wird durch das kaufmännische Und ( & ) dargestellt und hat zwei Operanden. Im Wesentlichen besteht bitweises UND darin, jedes Bit zweier Zahlen auszurichten und dann die entsprechende UND-Operation für jedes Bit basierend auf den Regeln in der Wahrheitstabelle durchzuführen.
Bitweises ODER
Der bitweise ODER-Operator wird durch das Pipe-Symbol ( | ) dargestellt und verfügt außerdem über zwei Operanden. Bitweises XOR verschiebt alle Ziffern des Werts um die angegebene Anzahl von Ziffern nach links. Wenn zum Beispiel der Wert 2 (binär 10) um 5 Bits nach links verschoben wird, erhalten Sie 64 (binär 1000000)
Rechtsverschiebung mit Vorzeichen
Eine Rechtsverschiebung mit Vorzeichen wird durch zwei Größer-als-Zeichen ( >> ; ), wodurch alle 32 Bits eines Werts nach rechts verschoben werden, während das Vorzeichen (positiv oder negativ) erhalten bleibt. Die vorzeichenbehaftete Rechtsverschiebung ist eigentlich die umgekehrte Operation der Linksverschiebung Schicht. Bei positiven Zahlen hat eine vorzeichenlose Rechtsverschiebung das gleiche Ergebnis wie eine vorzeichenbehaftete Rechtsverschiebung
5-3. Boolescher Operator
Logisches NICHT
Logisches UND
Logisches Oder
Multiplikationsoperator
Der Multiplikationsoperator wird durch ein Sternchen (*) dargestellt. Kann zur Berechnung verwendet werden das Produkt zweier Werte.
Divisionsoperator
Modulo-Operator
6. Anweisungen
ECMA-262 beschreibt einige Anweisungen (auch Flusskontrollanweisungen genannt), und der größte Teil der Syntax in ECMAScript spiegelt sich in Anweisungen wider. Anweisungen verwenden normalerweise ein oder mehrere Schlüsselwörter, um eine bestimmte Aufgabe zu erfüllen. Aussagen können einfach oder komplex sein. Es kann so einfach sein, der Funktion zu sagen, dass sie beendet werden soll, oder so komplex, wie das Auflisten einer Reihe von Anweisungen, die wiederholt ausgeführt werden sollen.
6-1. do-while-Anweisung
Die do-while-Anweisung ist eine Post-Test-Schleifenanweisung, das heißt, die Exit-Bedingung wird erst ausgewertet, nachdem der Code im Schleifenkörper ausgeführt wurde. Mit anderen Worten, der Code im Schleifenkörper wird mindestens einmal ausgeführt
Die while-Anweisung ist eine Schleifenanweisung, die zuerst getestet wird, d. h. die Exit-Bedingung wird zuerst erkannt und Dann wird der Code im Schleifenkörper ausgeführt. Daher darf der Code im while-Schleifenkörper nicht ausgeführt werden. 7. Funktionen
Funktionen sind Kernkomponenten jeder Sprache, da sie Anweisungen kapseln und diese dann überall und jederzeit ausführen können. Funktionen in ECMAScript werden mit dem Schlüsselwort function deklariert, gefolgt von einer Reihe von Parametern und dann dem Funktionskörper.Funktionen in ECMAScript müssen nicht angeben, ob ein Wert zurückgegeben werden soll. Jede Funktion kann jederzeit die Return-Anweisung verwenden, um den Wert der Funktion zurückzugeben, gefolgt vom zurückzugebenden Wert
Die Funktion sum() addiert die beiden Werte und gibt das Ergebnis zurück. Beachten Sie, dass es außer der Return-Anweisung keine spezielle Erklärung gibt, dass die Funktion einen Rückgabewert hat. Der strikte Modus unterliegt auch einigen Einschränkungen für Funktionen:Die Funktion kann nicht als eval oder als Argumente bezeichnet werden.
Die Parameter der Funktion können nicht aufgerufen werden eval oder arguments;Zwei Die Parameter der Funktion können nicht mit demselben Namen aufgerufen werden.
8. Variablen, Umfang und Speicher
4-1. Primitive Werte und Referenzwerte
ECMAScript-Variablen können zwei verschiedene Arten von Daten enthalten: Primitive Werte und Referenzwerte. Der primitive Wert ist der einfachste Datenwert, und der Referenzwert ist ein Objekt, das aus mehreren Werten besteht.Beim Zuweisen eines Werts zu einer Variablen muss die JavaScript-Engine bestimmen, ob der Wert ein primitiver Wert oder ein Referenzwert ist. Im vorherigen Kapitel wurden sechs Grundwerte besprochen: Undefiniert, Null, Boolesch, Zahl, Zeichenfolge und Symbol. Auf Variablen, die primitive Werte enthalten, wird über den Wert zugegriffen, da wir mit dem tatsächlichen Wert arbeiten, der in der Variablen gespeichert ist.
Referenzwerte sind im Speicher gespeicherte Objekte. Im Gegensatz zu anderen Sprachen erlaubt JavaScript keinen direkten Zugriff auf Speicherorte und kann daher nicht direkt auf dem Speicherbereich arbeiten, in dem sich das Objekt befindet. Beim Bedienen eines Objekts handelt es sich bei dem, was tatsächlich bedient wird, um einen Verweis auf das Objekt und nicht um das eigentliche Objekt selbst. Zu diesem Zweck wird auf die Variable, die den Referenzwert enthält, per Referenz zugegriffen. Hinweis: In vielen Sprachen werden Zeichenfolgen durch Objekte dargestellt und gelten daher als Referenztypen. ECMAScript bricht diese Konvention. Dynamische Eigenschaften Primitive Werte und Referenzwerte werden auf sehr ähnliche Weise definiert, beide erstellen eine Variable und weisen ihr dann einen Wert zu. Was jedoch mit dem Wert gemacht werden kann, nachdem die Variable ihn hält, ist ganz anders. Für Referenzwerte können deren Eigenschaften und Methoden jederzeit hinzugefügt, geändert und gelöscht werden.
Bei der Übergabe von Parametern über Werte wird der Wert in einen lokalen Wert kopiert Eine Variable (d. h. ein benannter Parameter oder im ECMAScript-Sprachgebrauch ein Slot im Argumentobjekt). Wenn Parameter als Referenz übergeben werden, wird die Position des Werts im Speicher in einer lokalen Variablen gespeichert, was bedeutet, dass Änderungen an der lokalen Variablen außerhalb der Funktion widergespiegelt werden
Per Definition sind alle Referenzwerte Instanzen von Object , sodass jeder Referenzwert, der über den Operator „instanceof“ und den Object-Konstruktor erkannt wird, „true“ zurückgibt. Wenn Sie zum Erkennen eines Grundwerts „instanceof“ verwenden, wird ebenfalls immer „false“ zurückgegeben, da der Grundwert kein Objekt ist.
Beachten Sie, dass der Operator „typeof“ auch „Funktion“ zurückgibt, wenn er zum Erkennen von Funktionen verwendet wird. Bei Verwendung zur Erkennung regulärer Ausdrücke in Safari (bis Safari 5) und Chrome (bis Chrome 7) gibt typeof aufgrund von Implementierungsdetails auch „function“ zurück. ECMA-262 besagt, dass jedes Objekt, das die interne Methode [[Call]] implementiert, bei der Art der Erkennung „Funktion“ zurückgeben sollte. Da reguläre Ausdrücke in den oben genannten Browsern diese Methode implementieren, gibt typeof auch „function“ für reguläre Ausdrücke zurück. In IE und Firefox gibt typeof für reguläre Ausdrücke „object“ zurück.
4-2. Ausführungskontext und -umfang
Das Konzept des Ausführungskontexts (oben als „Kontext“ bezeichnet) ist in JavaScript sehr wichtig. Der Kontext einer Variablen oder Funktion bestimmt, auf welche Daten sie zugreifen kann und wie sie sich verhält. Jeder Kontext hat ein zugehöriges Variablenobjekt und
alle in diesem Kontext definierten Variablen und Funktionen existieren auf diesem Objekt. Obwohl auf das Variablenobjekt nicht über Code zugegriffen werden kann, wird es zur Verarbeitung von Daten im Hintergrund verwendet.
Der globale Kontext ist der äußerste Kontext. Abhängig von der Hostumgebung der ECMAScript-Implementierung kann das Objekt, das den globalen Kontext darstellt, unterschiedlich sein. Im Browser ist der globale Kontext das, was wir oft als Fensterobjekt bezeichnen (wird in Kapitel 12 ausführlich vorgestellt), sodass alle über
var definierten globalen Variablen und Funktionen zu Eigenschaften und Methoden des Fensterobjekts werden. Deklarationen der obersten Ebene mit let und const werden nicht im globalen Kontext definiert, haben aber die gleiche Auswirkung auf die Auflösung der Bereichskette. Der Kontext wird zerstört, nachdem sein gesamter Code ausgeführt wurde, einschließlich aller darauf definierten Variablen und Funktionen (der globale Kontext wird erst zerstört, wenn die Anwendung beendet wird, z. B. wenn die Webseite geschlossen oder der Browser beendet wird).
Jeder Funktionsaufruf hat seinen eigenen Kontext. Wenn der Codeausführungsfluss in eine Funktion eintritt, wird der Kontext der Funktion auf einen Kontextstapel verschoben. Nachdem die Funktion ausgeführt wurde, öffnet der Kontextstapel den Funktionskontext und gibt die Kontrolle an den vorherigen Ausführungskontext zurück. ECMAScript
Der Ausführungsfluss des Programms wird über diesen Kontextstapel gesteuert. Wenn der Code im Kontext ausgeführt wird, erstellt er eine Bereichskette variabler Objekte. Diese Bereichskette bestimmt die Reihenfolge, in der der Code auf jeder Kontextebene auf Variablen und Funktionen zugreift. Das variable Objekt des Kontexts, in dem der Code ausgeführt wird, steht immer am Anfang der Bereichskette. Wenn der Kontext eine Funktion ist, wird ihr Aktivierungsobjekt als Variablenobjekt verwendet. Das aktive Objekt verfügt zunächst nur über eine definierte Variable: Argumente. (Im globalen Kontext gibt es keine solche Variable.) Das nächste Variablenobjekt in der Bereichskette stammt aus dem enthaltenden Kontext und das nächste Objekt kommt aus dem enthaltenden Kontext danach. Und so weiter, bis der globale Kontext vorhanden ist. Das variable Objekt des globalen Kontexts ist immer das letzte variable Objekt der Bereichskette (der dritte Kontext des eval()-Aufrufs), aber es gibt auch andere Möglichkeiten, die Bereichskette zu erweitern. Bestimmte Anweisungen bewirken, dass am Anfang der Bereichskette vorübergehend ein Kontext hinzugefügt wird, der nach der Ausführung des Codes
Variablendeklaration
Nach ES6 hat die JavaScript-Variablendeklaration weltbewegende Veränderungen erfahren. Bis
ECMAScript 5.1 war var das einzige Schlüsselwort zum Deklarieren von Variablen. ES6 fügt nicht nur die Schlüsselwörter
let und const hinzu, sondern sorgt auch dafür, dass diese beiden Schlüsselwörter
var als erste Wahl bei weitem übertreffen.
Funktionsbereichsdeklaration mit var
Beim Deklarieren einer Variablen mit var wird die Variable automatisch dem nächstgelegenen Kontext hinzugefügt. Innerhalb einer Funktion ist der nächstgelegene Kontext der lokale Kontext der Funktion. In einer with-Anweisung ist der nächstgelegene Kontext auch der Funktionskontext. Wenn eine Variable initialisiert wird, ohne sie zu deklarieren, wird sie automatisch zum globalen Kontext hinzugefügt Hinweis: Das Initialisieren einer Variablen ohne Deklaration ist ein sehr häufiger Fehler in der JavaScript-Programmierung und kann viele Probleme verursachen. Aus diesem Grund müssen Leser Variablen deklarieren, bevor sie sie initialisieren. Im strikten Modus führt das Initialisieren einer Variablen ohne Deklaration zu einem Fehler注意：未经声明而初始化变量是JavaScript编程中一个非常常见的错误，会导致很多问题。为此，读者在初始化变量之前一定要先声明变量。在严格模式下，未经声明就初始化变量会报错
var 声明会被拿到函数或全局作用域的顶部，位于作用域中所有代码之前。这个现象叫作“提升”（hoisting）。提升让同一作用域中的代码不必考虑变量是否已经声明就可以直接使用。可是在实践中，提升也会导致合法却奇怪的现象，即在变量声明之前使用变量。
使用 let 的块级作用域声明
ES6新增的 let 关键字跟 var 很相似，但它的作用域是块级的，这也是JavaScript中的新概念。块级作用域由最近的一对包含花括号 {} 界定。换句话说， if 块、 while 块、 function块，甚至连单独的块也是 let 声明变量的作用域。
使用 const 的常量声明
除了 let ，ES6同时还增加了 const 关键字。使用 const 声明的变量必须同时初始化为某个值。一经声明，在其生命周期的任何时候都不能再重新赋予新值
注意 开发实践表明，如果开发流程并不会因此而受很大影响，就应该尽可能地多使用 const 声明，除非确实需要一个将来会重新赋值的变量。这样可以从根本上保证提前发现重新赋值导致的bug Die Variablendeklaration wird an den Anfang der Funktion oder des globalen Bereichs verschoben, vor dem gesamten Code im Bereich. Dieses Phänomen wird als „Heben“ bezeichnet. Durch das Hochziehen kann Code im selben Bereich die Variable verwenden, ohne sich Gedanken darüber machen zu müssen, ob sie deklariert wurde. In der Praxis kann die Förderung jedoch auch zu dem legalen, aber seltsamen Phänomen führen, dass Variablen verwendet werden, bevor sie deklariert werden.
Verwenden Sie die Bereichsdeklaration „let“ auf Blockebene.
Das neue Schlüsselwort „let“ in ES6 ist var sehr ähnlich, sein Gültigkeitsbereich ist jedoch auf Blockebene, was ebenfalls ein neues Konzept in JavaScript ist. Der Bereich auf Blockebene wird durch das nächste Paar geschweifter Klammern {} begrenzt. Mit anderen Worten, wenn Blöcke, während Blöcke, Funktionsblöcke und sogar einzelne Blöcke den Umfang der deklarierten Variablen let umfassen. Verwenden Sie die const-Konstantendeklaration🎜 Zusätzlich zu let fügt ES6 auch das const-Schlüsselwort hinzu. Mit const deklarierte Variablen müssen ebenfalls auf einen Wert initialisiert werden. Sobald es deklariert ist, kann ihm zu keinem Zeitpunkt seines Lebenszyklus ein neuer Wert zugewiesen werden Verwenden Sie möglichst const-Deklarationen, es sei denn, Sie benötigen wirklich eine Variable, die in Zukunft neu zugewiesen wird. Dadurch kann grundsätzlich sichergestellt werden, dass durch Neuzuweisungen verursachte Fehler im Voraus entdeckt werden.🎜🎜🎜4-3JavaScript ist eine Sprache, die Garbage Collection verwendet, was bedeutet, dass die Ausführungsumgebung für die Speicherverwaltung verantwortlich ist Der Code wird ausgeführt. In Sprachen wie C und C++ stellt die Verfolgung der Speichernutzung eine große Belastung für Entwickler dar und ist die Ursache vieler Probleme. JavaScript entlastet Entwickler von dieser Belastung und implementiert die Speicherzuweisung und das Recycling ungenutzter Ressourcen durch automatische Speicherverwaltung. Die Grundidee ist einfach: Bestimmen Sie, welche Variable nicht mehr verwendet wird, und geben Sie den von ihr belegten Speicher frei. Dieser Prozess ist zyklisch, das heißt, das Garbage-Collection-Programm wird automatisch in bestimmten Intervallen ausgeführt (oder zu einem geplanten Sammelzeitpunkt während der Codeausführung). Der Garbage-Collection-Prozess ist eine ungefähre und unvollständige Lösung, denn ob ein bestimmter Speicherbereich noch nützlich ist, ist ein „unentscheidbares“ Problem, was bedeutet, dass es nicht durch Algorithmen gelöst werden kann. 🎜🎜Nehmen wir als Beispiel den normalen Lebenszyklus lokaler Variablen in einer Funktion. Lokale Variablen in einer Funktion sind vorhanden, wenn die Funktion ausgeführt wird. Zu diesem Zeitpunkt weist der Stapelspeicher (oder Heapspeicher) Speicherplatz zu, um den entsprechenden Wert zu speichern. Die Funktion verwendet intern Variablen und wird dann beendet. Zu diesem Zeitpunkt wird die lokale Variable nicht mehr benötigt und der von ihr belegte Speicher kann für die spätere Verwendung freigegeben werden. Es ist offensichtlich, dass lokale Variablen in diesem Fall nicht mehr benötigt werden, aber es ist nicht immer offensichtlich. Der Garbage Collector muss nachverfolgen, welche Variablen noch verwendet werden und welche nicht mehr verwendet werden, um Speicher zurückzugewinnen. Es kann unterschiedliche Implementierungen zum Markieren nicht verwendeter Variablen geben. In der Geschichte der Browserentwicklung wurden jedoch hauptsächlich zwei Markup-Strategien verwendet: Markup-Bereinigung und Referenzzählung. 🎜Mark Sweep
Die am häufigsten verwendete Garbage-Collection-Strategie in JavaScript ist Mark-and-Sweep. Wenn eine Variable in den Kontext eintritt, beispielsweise durch die Deklaration einer Variablen innerhalb einer Funktion, wird die Variable als im Kontext vorhanden markiert. Variablen, die sich nicht im Kontext befinden, sollten logischerweise niemals ihren Speicher freigeben, da sie verwendet werden können, solange der Code im Kontext ausgeführt wird. Wenn eine Variable den Kontext verlässt, wird sie auch als den Kontext verlassend markiert.
Es gibt viele Möglichkeiten, Variablen zu kennzeichnen. Wenn beispielsweise eine Variable in den Kontext eintritt, können Sie ein bestimmtes Bit invertieren. Alternativ können Sie zwei Listen mit Variablen „im Kontext“ und „nicht im Kontext“ verwalten und Variablen von einer Liste in die andere verschieben. Die Umsetzung des Markierungsprozesses ist nicht wichtig, der Schlüssel liegt in der Strategie.
Wenn das Garbage-Collection-Programm ausgeführt wird, markiert es alle im Speicher gespeicherten Variablen (denken Sie daran, dass es viele Möglichkeiten zum Markieren gibt). Anschließend werden die Tags von allen Variablen im Kontext sowie von Variablen entfernt, auf die von Variablen im Kontext verwiesen wird. Nach diesem Punkt markierte Variablen sind zu löschen, da sie für keine Variablen im Kontext mehr zugänglich sind. Anschließend führt der Garbage Collector eine Speicherbereinigung durch, bei der alle markierten Werte zerstört und deren Speicher zurückgefordert werden.
Im Jahr 2008 verwendeten IE, Firefox, Opera, Chrome und Safari alle die Markup-Bereinigung (oder eine Variante davon) in ihren JavaScript-Implementierungen und unterschieden sich nur darin, wie oft sie die Garbage Collection durchführten.
Referenzzählung
Eine weitere, weniger häufig verwendete Garbage-Collection-Strategie ist die Referenzzählung. Die Idee besteht darin, für jeden Wert aufzuzeichnen, wie oft auf ihn verwiesen wurde. Wenn Sie eine Variable deklarieren und ihr einen Referenzwert zuweisen, ist die Referenznummer dieses Werts 1. Wird derselbe Wert einer anderen Variablen zugewiesen, erhöht sich die Referenznummer um 1. Wenn die Variable, die eine Referenz auf den Wert enthält, durch einen anderen Wert überschrieben wird, wird der Referenzzähler entsprechend um eins dekrementiert. Wenn die Anzahl der Verweise auf einen Wert 0 beträgt, bedeutet dies, dass auf den Wert nicht mehr zugegriffen werden kann, sodass sein Speicher sicher zurückgewonnen werden kann. Das Garbage-Collection-Programm
gibt den Speicher bei der nächsten Ausführung mit der Referenznummer 0 frei. Die Referenzzählung wurde erstmals von Netscape Navigator 3.0 übernommen, stieß jedoch bald auf ein ernstes Problem: Zirkelverweise. Der sogenannte Zirkelverweis bedeutet, dass Objekt A einen Zeiger hat, der auf Objekt B zeigt, und Objekt B auch auf Objekt A verweist.
待更新。。。
Verwandte kostenlose Lernempfehlungen: Javascript (Video)
Das obige ist der detaillierte Inhalt vonNotieren Sie sich Notizen zum JavaScript-Lernen. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!
![[Web-Frontend] Node.js-Schnellstart](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
