Wondershare EdrawMind
Mindmap-Galerie JS-Grundlagen Tag1
- 6
JS-Grundlagen Tag1
Dies ist eine Mindmap über die Grundlagen von JS Tag 1. JS ist eine Programmiersprache, die auf dem Client ausgeführt wird, um Interaktionseffekte zwischen Mensch und Computer zu erzielen.
Bearbeitet um 2024-01-18 10:20:27
- Für Sie empfohlen
- Gliederung
JS-Grundlagen Tag1
Einführung in JS
Was ist JS?
Es handelt sich um eine Programmiersprache, die auf dem Client ausgeführt wird, um Interaktionseffekte zwischen Mensch und Computer zu erzielen.
Die Zusammensetzung von JS
ECMAScript
Gibt die grundlegende Syntax und das Kernwissen von js an
Zum Beispiel: Variablen, Verzweigungsanweisungen, Schleifenanweisungen, Objekte usw.
Web-APIs
DOM: Dokumente bearbeiten, z. B. Seitenelemente verschieben, in der Größe ändern, hinzufügen, löschen usw
Stückliste: Bedienen Sie den Browser, z. B. Seiten-Popups, erkennen Sie die Fensterbreite, speichern Sie Daten im Browser usw.
Wirkung
Spezialeffekte für Webseiten (Überwachen einiger Verhaltensweisen des Benutzers, damit die Webseite entsprechendes Feedback geben kann)
Formularvalidierung (Beurteilung der Rechtmäßigkeit von Formulardaten)
Dateninteraktion (Erhalten von Hintergrunddaten und Rendern an das Frontend)
Serverseitige Programmierung (node.js)
JS-Schreibposition
Inline-JS
Internes JS
Schreiben Sie direkt in die HTML-Datei und umschließen Sie sie mit Skript-Tags
Spezifikation: Das Skript-Tag wird über </body> geschrieben
Erweiterung: Die Seite „alert(„Hallo, js“)“ öffnet ein Warndialogfeld
Externes JS
Der Code wird in eine Datei mit der Endung .js geschrieben
Syntax: Wird über Skript-Tags in die HTML-Seite eingeführt
Wie schreibe ich JS?
Kommentar
Einzeilige Kommentare
Symbol://
Funktion: //Die Codezeile rechts wird ignoriert
Tastenkombination: Strg /
Kommentare blockieren
Symbol:/**/
Wirkung: Alles zwischen /* und */ wird ignoriert
Tastenkombination: Umschalt Alt A
Terminator
Funktion: Verwenden Sie Englisch; stellt das Ende des Satzes dar
Tatsächliche Situation: In der tatsächlichen Entwicklung kann es geschrieben werden oder nicht, und der Browser kann automatisch auf die Endposition der Anweisung schließen (ohne sie hinzuzufügen).
JS-Eingabe- und Ausgabesyntax
Ausgabesyntax
document.write('auszugebender Inhalt')
Funktion: Inhalte in den Textkörper ausgeben
Hinweis: Wenn der Ausgabeinhalt in Tags geschrieben ist, wird er auch in Webseitenelemente geparst.
Alert("Ausgabeinhalt")
Funktion: Die Seite öffnet ein Warndialogfeld
console.log("Konsolendruck")
Konsolenausgabesyntax, die von Programmierern zum Debuggen verwendet wird
Eingabesyntax
prompt("Bitte geben Sie Ihren Namen ein:")
Funktion: Zeigt ein Dialogfeld an, das eine Textnachricht enthält, um den Benutzer zur Eingabe von Text aufzufordern.
wörtlich
JS-Abfrage autorisierende Website MDN
Variable
Was sind Variablen?
Der „Container“, der zum Speichern von Daten in einem Computer verwendet wird, ist einfach eine Box.
Die Rolle von Variablen
Wird zum Speichern von Daten verwendet
Grundlegende Verwendung von Variablen
variable Aussage
Um eine Variable verwenden zu können, müssen Sie sie zunächst erstellen (auch bekannt als „Variable deklarieren“ oder „Variable definieren“).
Syntax: let-Variablenname
Die Deklaration einer Variablen besteht aus zwei Teilen: dem Deklarationsschlüsselwort und dem Variablennamen (Identifikation).
Variablenzuweisung
Nachdem Sie eine Variable definiert haben, können Sie sie initialisieren. Folgen Sie dem Variablennamen mit „=“ und dann dem Wert (Hinweis: Erhalten Sie die Daten in der Variablen über den Variablennamen).
Sie können den Zuweisungsvorgang auch direkt beim Deklarieren der Variablen abschließen. Dieser Vorgang wird auch als Variableninitialisierung bezeichnet.
Variable aktualisieren
Nachdem einer Variablen ein Wert zugewiesen wurde, können Sie sie auch aktualisieren, indem Sie ihr einfach einen anderen Wert zuweisen (Hinweis: Mehrfachdeklarationen einer Variablen sind bei let nicht zulässig).
Variablenfall: Austausch des Wertes einer Variablen
Kernidee: Verwenden Sie eine temporäre Variable zur Zwischenspeicherung
Deklarieren Sie mehrere Variablen
Nachdem einer Variablen ein Wert zugewiesen wurde, können Sie sie auch aktualisieren, indem Sie ihr einfach einen anderen Wert zuweisen.
Syntax: Mehrere durch Kommas getrennte Variablen
Hinweis: Es kann sein, dass die Codelänge kürzer ist, dies wird jedoch nicht empfohlen. Bitte deklarieren Sie zur besseren Lesbarkeit nur eine Variable pro Zeile
Die Natur von Variablen
Speicher: Der Ort, an dem Daten in einem Computer gespeichert werden, entspricht einem Leerzeichen
Das Wesen einer Variablen: Es handelt sich um einen kleinen Speicherbereich, der vom Programm zum Speichern von Daten verwendet wird.
Benennungsregeln und Spezifikationen für Variablen
Regeln: müssen befolgt werden, Fehler werden gemeldet, wenn sie nicht befolgt werden (rechtliche Ebene).
Schlüsselwörter können nicht verwendet werden
Zeichen mit besonderer Bedeutung, einige in JS integrierte englische Vokabeln
Es kann nur aus Unterstrichen, Buchstaben, Zahlen und $ bestehen und Zahlen dürfen nicht damit beginnen.
Bei Buchstaben wird strikt auf Groß- und Kleinschreibung geachtet. Beispielsweise sind „Alter“ und „Alter“ unterschiedliche Variablen.
Spezifikation
Der Name sollte aussagekräftig sein
Halten Sie sich an die Benennungsmethode in Kamelbuchstaben: Der erste Buchstabe des ersten Wortes wird in Kleinbuchstaben geschrieben, und der erste Buchstabe jedes nachfolgenden Wortes wird großgeschrieben, z. B.: Benutzername
Variablenerweiterung – der Unterschied zwischen let und var
var-Deklaration
Sie können es zuerst verwenden und es dann deklarieren (unvernünftig)
Mit var deklarierte Variablen können wiederholt deklariert werden (unvernünftig)
Zum Beispiel Variablenheraufstufung, globale Variablen, kein Gültigkeitsbereich auf Blockebene usw.
Variablenerweiterung - Array
Deklarationssyntax
let Array-Name = [Daten 1, Daten 2...Daten n]
Arrays werden der Reihe nach gespeichert, sodass alle Daten eine eigene Nummer haben
Arrays können jede Art von Daten speichern
Wertesyntax
Array-Name[Index]
der Begriff
Element: Alle im Array gespeicherten Daten werden als Array-Element bezeichnet.
Index: die Nummer der Daten im Array
Länge: Die Anzahl der Daten im Array, die über das Längenattribut des Arrays ermittelt wird
Konstante
Grundlegende Verwendung von Konstanten
Konzept: Mit const deklarierte Variablen werden „Konstanten“ genannt.
Verwendungsszenario: Wenn sich eine Variable nie ändert, können Sie sie mit const anstelle von let deklarieren
Namenskonvention: konsistent mit Variablen
Konstante Nutzung: const G = 9,8
Hinweis: Konstanten dürfen nicht neu zugewiesen werden und müssen bei der Deklaration zugewiesen (initialisiert) werden.
Tipp: Verwenden Sie const für Daten, die nicht neu zugewiesen werden müssen
Art der Daten
JS-Datentypen werden im Allgemeinen in zwei Kategorien unterteilt
Grundlegende Datentypen
Zahl numerischer Typ
Die in der Mathematik gelernten Zahlen, ganze Zahlen, Dezimalzahlen, positive Zahlen und negative Zahlen, werden zusammenfassend als Zahlentypen bezeichnet.
Hinweis: JS ist ein schwacher Datentyp. Zu welchem Typ eine Variable gehört, kann erst nach dem Kopieren bestätigt werden.
mathematische Operatoren
Inhalte einbeziehen
Summe
- Finde den Unterschied
* Finden Sie das Produkt
/ Geschäfte suchen
% Finden Sie den Rest
Ausführungspriorität
Multiplikation, Division und Rest haben die gleiche Priorität.
Die Prioritäten für Addition und Subtraktion sind gleich
Multiplikation, Division und Rest haben höhere Priorität als Addition und Subtraktion.
Verwenden Sie (), um die Priorität zu erhöhen
NaN
NaN stellt einen Rechenfehler dar. Es ist das Ergebnis einer falschen oder undefinierten mathematischen Operation
NaN ist klebrig. Jede Operation an NaN gibt NaN zurück
String-String-Typ
Definition
In einfache Anführungszeichen, doppelte Anführungszeichen und Backticks eingeschlossene Daten werden als Zeichenfolgen bezeichnet. Es gibt grundsätzlich keinen Unterschied zwischen einfachen und doppelten Anführungszeichen. Es wird empfohlen, einfache Anführungszeichen zu verwenden.
Vorsichtsmaßnahmen
Sowohl einfache als auch doppelte Anführungszeichen müssen paarweise verwendet werden
Einfache und doppelte Anführungszeichen können ineinander verschachtelt werden, sie können sich jedoch nicht selbst verschachteln.
Bei Bedarf können Sie das Escape-Zeichen \ verwenden, um einfache und doppelte Anführungszeichen auszugeben.
String-Verkettung
Szenario: Der Bediener kann eine Zeichenfolgenverkettung realisieren
Vorlagenzeichenfolge
Szenen, die verwendet werden sollen
Verketten Sie Zeichenfolgen und Variablen
Bevor es verfügbar war, war es mühsam, Variablen zu verbinden.
Grammatik
`` (Backtick)
Wenn Sie Inhalte in Variablen zusammenfügen, umschließen Sie die Variablen mit ${}
document.write(`Hallo zusammen, mein Name ist ${name}, ich bin dieses Jahr ${age})
boolean Boolescher Typ
Beim Ausdrücken einer Bestätigung oder Verneinung entspricht der Computer Daten vom booleschen Typ, die zwei feste Werte haben, wahr und falsch.
undefinierter undefinierter Typ
Undefiniert ist ein spezieller Typ mit nur einem undefinierten Wert
Wenn Sie eine Variable nur deklarieren, ohne einen Wert zuzuweisen, ist der Standardwert der Variablen undefiniert. Im Allgemeinen ist es selten, einer Variablen direkt undefiniert zuzuweisen.
Während der Entwicklung deklarieren wir häufig eine Variable und warten auf die Übergabe von Daten. Wenn Sie nicht wissen, ob die Daten übergeben wurden, können Sie prüfen, ob diese Variable undefiniert ist und feststellen, ob der Benutzer Daten übergeben hat.
null leerer Typ
Null ist in JS nur ein spezieller Wert, der „keine“, „leer“ oder „Wert unbekannt“ bedeutet.
Der Unterschied zwischen undefiniert
undefiniert bedeutet keine Zuweisung
null bedeutet, dass ein Wert zugewiesen ist, der Inhalt jedoch leer ist
Anwendungsszenarien für die Entwicklung
Offizielle Erklärung: Behandeln Sie null als ein Objekt, das noch nicht erstellt wurde
Umgangssprache: In Zukunft wird ein Objekt in einer Variablen gespeichert, das Objekt wurde jedoch noch nicht erstellt. Sie können ihm zunächst Null geben.
Datentyp erkennen
Art der
Als Operator: typeof x (gängige Schreibweise)
Funktionsform: typeof(x)
Hinweis: Das Ergebnis ist mit oder ohne Klammern dasselbe. Verwenden Sie daher den Operator direkt.
Referenzdatentyp
Objekt Objekt
Typkonvertierung
Warum eine Typkonvertierung erforderlich ist
JS ist ein Datentyp: JS weiß nicht, zu welchem Datentyp es gehört. Dies wird erst nach der Zuweisung klar.
Fallstrick: Die mithilfe von Formularen und Eingabeaufforderungen erhaltenen Daten sind standardmäßig vom Typ Zeichenfolge und Additionsvorgänge können derzeit nicht direkt ausgeführt werden.
Zu diesem Zeitpunkt müssen Sie den Datentyp der Variablen ändern
implizite Konvertierung
Wenn bestimmte Operatoren ausgeführt werden, konvertiert das System den Datentyp automatisch intern. Diese Konvertierung wird als implizite Konvertierung bezeichnet.
Regel
Solange eine der beiden Seiten der Zahl eine Zeichenfolge ist, wird die andere in eine Zeichenfolge umgewandelt.
Andere arithmetische Operatoren als -*/ konvertieren Daten in numerische Typen.
Mangel
Der Konvertierungstyp ist nicht klar und kann nur aufgrund von Erfahrungswerten zusammengefasst werden.
Tipps
Das Vorzeichen kann in einen numerischen Typ umgewandelt werden, wenn es als positives Vorzeichen analysiert wird.
Das Ergebnis des Hinzufügens beliebiger Daten zu einer Zeichenfolge ist eine Zeichenfolge
Konvertierung anzeigen
Es ist nicht streng, sich beim Schreiben eines Programms zu sehr auf die implizite Konvertierung innerhalb des Systems zu verlassen, da die Regeln der impliziten Konvertierung nicht klar sind und größtenteils auf aus Erfahrung zusammengefassten Regeln basieren. Um Probleme durch implizite Konvertierung zu vermeiden, werden Daten normalerweise explizit entsprechend den logischen Anforderungen konvertiert.
Konzept: Schreiben Sie Ihren eigenen Code, um dem System mitzuteilen, in welchen Typ konvertiert werden soll
In numerischen Typ konvertieren
Anzahl(Daten)
In numerischen Typ konvertieren
Wenn die Zeichenfolge Nicht-Ziffern enthält, ist das Ergebnis NaN, wenn die Konvertierung fehlschlägt, was bedeutet, dass es sich nicht um eine Zahl handelt.
NaN sind ebenfalls Zahlentypdaten, die Nichtzahlen darstellen
parselnt(Daten)
Behalten Sie nur ganze Zahlen
parseFloat(data)
Dezimalstellen können beibehalten werden