Eine kurze Zusammenfassung der Wissenspunkte zum JavaScript-Lernen

So starten Sie schnell mit VUE3.0: Geben Sie

entsprechende Empfehlungen ein und lernen Sie sie kennen: JavaScript-Tutorial

1, Einfache Einführung in JavaScript

1.1. Eine clientseitige Skriptsprache

, die im Client-Browser ausgeführt wird. Jeder Browser verfügt über eine JavaScript-Parsing-Engine-Skriptsprache: Sie muss nicht kompiliert werden, sie kann direkt vom Browser analysiert und ausgeführt werden. Sie kann den Interaktionsprozess zwischen Benutzern und HTML-Seiten verbessern, HTML-Elemente steuern und die Seite dynamisch machen . Wirkung und Verbesserung des Benutzererlebnisses

1.2 Geschichte der JavaScript-Entwicklung

Im Jahr 1992 entwickelte Nombase die erste clientseitige Skriptsprache, die speziell für die Formularüberprüfung verwendet wurde. Benannt: C--, später umbenannt in: ScriptEase
1995 entwickelte Netscape eine clientseitige Skriptsprache: LiveScript. Später wurden Experten von SUN eingeladen, LiveScript zu modifizieren und es JavaScript zu nennen
1996 kopierte Microsoft JavaScript und entwickelte die Sprache JScript.
Im Jahr 1997 formulierte ECMA (European Computer Manufacturers Association) einen Standard für clientseitige Skriptsprachen: ECMAScript, der die Kodierungsmethoden aller clientseitigen Skriptsprachen vereinheitlicht.

JavaScript = ECMAScript + JavaScripts eigene einzigartige Dinge (BOM+DOM)

1.3 Vorteile von JavaScript

a
b. Objektbasiert
c. Ereignisgesteuert
d. Schwacher Typ
e. Hohe Sicherheit
f. Plattformübergreifend

1.4. JavaScript-Referenz

Wenn Sie JavaScript in die HTML-Seite einfügen müssen, verwenden Sie bitte das <script> -Tag.
<script> 和</script> teilen JavaScript mit, wo es beginnen und enden soll.
Die Codezeilen zwischen <script> 和</script> enthalten JavaScript

<script type="text/javascript" src="${request.contextPath}/static/js/homepage.js"></script>

Mehrere Möglichkeiten der JavaScript-Ausgabe

window.alert()document.write()innerHTML
console.log()

Für den persönlichen Gebrauch ist console.log() bequemer in der Programmierung. Sie können den Ausgabeinhalt direkt über die F12-Konsole anzeigen

.

1.7.JavaScript-Kommentar

// Dies ist der Code: ein einzelner Satzkommentar, normalerweise die Strg + L-Taste im Editor.
/* Dies ist der Code*/: Mehrzeilige Kommentare, normalerweise Strg + Umschalt + L-Tasten im Editor.

1.8.Was sind die allgemeinen Bezeichner in JavaScript?

1.9.Was sind die häufigsten HTML-Ereignisse in JavaScript?

1.10. Gängige JavaScript-Operatoren

1.11.Gemeinsame Zuweisungsoperatoren in JavaScript

1.12.Gemeinsame Vergleichsoperatoren in JavaScript

1.13.Gemeinsame logische Operatoren in JavaScript

2. Beschreiben Sie die grundlegende Syntax von JavaScript im Detail

2.1. Variablen

2.1.1 Definieren Sie eine Variable

// Deklarieren Sie eine Variable mit dem Namen test. var test;

var age, name, sex;//Drei Variablen Alter, Name und Geschlecht deklarieren

//Variablen gleichzeitig deklarieren und Werte zuweisen var age = 10, name = „Xiaoqiang“, sex = „1 ";

2.1.2. Regeln und Spezifikationen für die Benennung von Variablen

1. Sie besteht aus Buchstaben, Zahlen, Unterstrichen und Symbolen. Sie kann nicht mit einer Zahl beginnen.
2. Schlüsselwörter können nicht verwendet werden, zum Beispiel: while
3. Groß- und Kleinschreibung beachten: herkömmliche Schreibweise
1. Variablennamen müssen aussagekräftig sein.
2. Beachten Sie die Camel-Case-Nomenklatur. Der erste Buchstabe der folgenden Wörter wird groß geschrieben, z. B. userName.

Datentypen

: Number类型、String类型、Boolean类型、Undefined类型、Null类型、Object类型

und

Number类型、String类型、Boolean类型、Undefined类型、Null类型、Object类型

Zahl Digitaler Typ: Enthält Ganzzahlen und Dezimalzahlen und kann ausgedrückt werden in: Dezimal, Oktal, Hexadezimal,

wie zum Beispiel:

var num = 10; 
//Dezimalvariable num1 = 012; 
//Oktale Variable num2 = ox123; 
//Hexadezimaler

Wertebereich:

console.log(Number.MAX_VALUE); 
//Der Maximalwert ist 5e-324console.log(Number.MIN_VALUE); 
//Der Mindestwert ist 1,7976931348623157e+308 Infinity: Infinity: -Infinity

numerische Beurteilung kann Dezimalzahlen nicht zur Überprüfung von Dezimalzahlen verwenden und NaN nicht verwenden, um zu überprüfen, ob es NaN ist (NaN ---- keine Zahl), aber Sie können isNaN verwenden — Ist das Ergebnis einer Zahl NaN?
Wie zum Beispiel:

var num; 
//Eine Variable deklarieren, nicht zugewiesen console.log(isNaN(num)); 
// Ist eine Zahl nicht wahr? Das Ergebnis ist wahr.

2.2.2.String

Zeichenfolgen-Escape-Zeichen:

z. B.:

var str = "Ich bin um Uhr\"console.log(str); 
// iam a pm

String-Verkettung:

var str1 = "Mr.";var str2 = "Hello";console.log(str1+str2); 
// Hallo Herr,

wenn das Ergebnis des Zusammenfügens von Zeichenfolgen und Zahlen auch der Effekt des Zusammenfügens von Zeichenfolgen ist, wie oben gezeigt

.

2.2.3 Boolescher Typ, die beiden Attribute true/false

. 2.2.4

bedeutet eine Variable, die vorhanden ist ohne Zuweisung deklariert, die Variable. Wenn sie nur deklariert wird, ist der Wert standardmäßig undefiniert.
Zum Beispiel:

var num;console.log(num); 
// undefiniert

2.2.5.Null

Wert

der Variablen null sein soll, muss er manuell festgelegt werden

.

2.3.1

Konvertierung des Datentyps

, Number() Jeder Wert kann in einen numerischen Wert umgewandelt werden. Wenn die zu konvertierende Zeichenfolge ein Zeichen enthält, das kein numerischer Wert ist, wird NaN zurückgegeben.
Beispiel:

var num1 = Number("10");console.log(num1); 
// 10var num2 = Number('10adbdn');console.log(num2); 
//NaNvar num3 = Number("10.78");console.log(num3); 
//10.78var num4 = Number('10.65dd');console.log(num4); 
//NaNvar num5 = Number("a10");console.log(num5); 
//NaN

(2), parseInt() konvertiert in eine Ganzzahl wie:

var num1 = parseInt("10");console.log(num1); 
// 10var num2 = parseInt('10adbdn');console.log(num2); 
//10var num3 = parseInt("10.78");console.log(num3); 
//10var num4 = parseInt('10.65dd');console.log(num4); 
//10var num5 =parseInt("a10");console.log(num5); 
//NaN

(3), parseFloat() in Dezimalzahl umwandeln, zum Beispiel:

var num1 = parseFloat("10");console.log(num1); 
// 10var num2 = parseFloat('10adbdn');console.log(num2); 
//10var num3 = parseFloat("10.78");console.log(num3); 
//10var num4 = parseFloat('10.65dd');console.log(num4); 
//10var num5 = parseFloat("a10");console.log(num5);

Der Unterschied zwischen (4), Number(), parseInt() und parseFloat()
Number() ist strenger als parseInt() und parseFloat().
parseInt() ähnelt parseFloat(), parseFloat analysiert den ersten oder nicht-zahligen Endpunkt

2.3.2 und konvertiert ihn in den String-Typ

(1), toString().
Zum Beispiel:

var num = 10;console.log(num.toString()); 
// String 10

(2), String()
Zum Beispiel:

var num1 =5;console.log(String(num1)); 
// String 5

(2), JSON.stringfy()

2.3.3. In booleschen Typ

0 konvertieren, leere Zeichenfolge, null, undefiniert, NaN wird in false konvertiert, andere werden in true konvertiert
Beispiel:

var num1 = Boolean(0);console.log(num1); 
// falsevar num2 = Boolean("");console.log(num2); 
// falsevar num3 = Boolean(null);console.log(num3); 
/ falsevar num4 = Boolean(undefiniert);console.log(num4); 
// falsevar num5 = 10;var num6;console.log(Boolean(num5+num6)); 
/ false

2.4. Operator

Operatortypen: arithmetische Operatoren, zusammengesetzte Operatoren, relationale Operatoren, logische Operatoren

(1), arithmetische Operatoren: „+“ „-“ „*“ „/“ „%“
Arithmetische Ausdrücke: Ausdrücke, die durch arithmetische Operatoren verbunden sind

(2).
Zusammengesetzte Operationsausdrücke: Ausdrücke (3), die durch zusammengesetzte Operatoren verbunden sind

, relationale Operatoren: ">""<"">=""<="" "" =""!=""!== "
Relationaler Operationsausdruck: Ausdrücke, die durch relationale Operatoren

(4) verbunden sind, logische Operatoren: „&&“ „||“ „!“

Ausdruck 1 && Ausdruck 2,

verbunden durch logische Operatoren

falsch

ist, ist das gesamte Ergebnis falsch

Wenn einer von ihnen wahr ist, ist das gesamte Ergebnis falsch

! Das Ergebnis des Ausdrucks expression ist wahr und das gesamte Ergebnis ist falsch.
Das Ergebnis des Ausdrucks ist falsch und das gesamte Ergebnis ist wahr

. 2.5 Die Priorität der Operatoren

ist von hoch nach niedrig:

() Der unäre Operator mit der höchsten Priorität ++ – !
Die arithmetischen Operatoren sind * / % und dann + -
Vergleichsoperatoren > >= < <=
Gleichheitsoperator == != === !==
Logische Operatoren sind && gefolgt von ||
Zuweisungsoperator

2.6. Funktion

2.6.1 Einführung

Funktionen in JavaScript sind Objekte. Ein Objekt ist eine Sammlung von Name/Wert-Paaren und hat eine versteckte Verbindung zum Prototypobjekt. Das vom Objektliteral erzeugte Objekt ist mit Object.prototype verbunden. Funktionsobjekte sind mit Function.prototype verbunden (das wiederum mit Object.prototype verbunden ist). Jeder Funktion werden beim Erstellen zwei versteckte Attribute zugeordnet: der Kontext der Funktion und der Code, der das Verhalten der Funktion implementiert

. 2.6.2 Die Funktion verwendet

die Funktion functionname() {hier ist der auszuführende Code}

Syntax:
Klammern können durch Kommas getrennte Argumente enthalten:

(Argument1, Argument2, …)

Von der Funktion ausgeführter Code wird in geschweifte Klammern gesetzt: {}

Funktionsname(Argument1, Argument2, Argument3) {
    Auszuführender Code}

Funktionsparameter sind die in der Funktionsdefinition aufgeführten Namen.
Funktionsargumente sind die tatsächlichen Werte, die die Funktion beim Aufruf der Funktion erhält

:

//Erstellen Sie hier eine Funktionssummenfunktion sum(num1, num2) {.
    var result = num1 + num2;
    console.log("num1 + num2 = " + result);}// Funktionsaufruf sum(10, 20);

Funktion sofort ausführen:

$(function(){
	//Nicht nur die hier geschriebenen Funktionen, alle Variablenausgaben usw. werden direkt geladen und ausgeführt. sum()})

Erstellen Sie reguläre

Ausdrucksliterale

. Syntax: Reg = /pattern/modifiers; die wörtliche Regelmäßigkeit besteht aus zwei Schrägstrichen//, und die Regel wird nach dem ersten Schrägstrich geschrieben: /pattern[Regeln können verschiedene Metazeichen schreiben |. . Schreiben Sie nach dem zweiten Schrägstrich den Bezeichner /modifiers [g globale Übereinstimmung |. m ^ Startposition |.
var Reg = /box/gi;
Konstrukteur. Syntax Reg = new RegExp( pattern , modifiers ); pattern, modifiers are strings at this time. Egal wie Sie es erstellen, es ist dasselbe: Mustervorlage, passender Inhalt und Modifikatoren.

var Reg = new RegExp("box",gi");

2.7.2. Methodenbeschreibung für reguläre Ausdrücke

wird str = ' a1b2c3a4a5',
    reg = /a/g;console.log(str.match(reg)); //["a", "a", "a"]var str = 'a1b2c3a4a5',
    reg = /a/;console.log(str.search(reg)); //0var str = 'a1b2c3a4a5',
    reg = /a/g;console.log(str.replace(reg,function(){
    console.log(Argumente);
    return 5555;}));var str = 'a,b,c,d',
    reg = /,/g;//console.log(str.split(',')); //["a", "b", "c", "d"]console.log(str.split( reg)) //["a", "b", "c", "d"]

2.7.3.Methodenbeschreibung des RegExp-Objekts

. Modifikatoren

werden auch als Bezeichner bezeichnet und können zur Durchführung von Übereinstimmungsmustern unter Berücksichtigung der Groß- und Kleinschreibung verwendet werden.
Ich ignoriere die Übereinstimmung von Groß- und Kleinschreibung.
g stimmt global überein. Ohne g wird nur das erste Element abgeglichen und es wird kein Abgleich durchgeführt.
m führt einen mehrzeiligen Abgleich durch

var patt = /pattern/i; //Globaler Abgleich var patt = /pattern/m

; Zeichen

sind Sonderzeichen, die in regulären Ausdrücken eine besondere Bedeutung haben.
Spezielle Übersetzungszeichen.

. Ein einzelnes Zeichen, außer Newline n und Tab r 
 Escape-Zeichen, Escape-Symbole mit besonderer Bedeutung in gewöhnliche Symbole: .d Zahlen [0~9]D Nicht-Zahlens LeerzeichenS Nicht-Leerzeichenw Zeichen [Buchstaben|Ziffern|Unterstrich]W Nicht- Zeichen b Wortgrenze (außer (Wort) alphanumerisch_ sind alle Wortgrenzen) B Nicht-Wortgrenze

var reg = /./;//match.var reg = /\/;//match var reg = / //;//Match /var str = '\';var reg = /\/g;console.log(reg.test(str)); //true

2.8.1

.Date Objekt

Ein Date-Objekt ist ein Objekt, das sich auf Datum und Uhrzeit bezieht. Es ist dynamisch und Sie müssen das Schlüsselwort new verwenden, um eine Instanz zu erstellen, wie zum Beispiel:
var Mydata=new Date();
Das Date-Objekt stellt keine Direktzugriffseigenschaften bereit, sondern nur Methoden zum Abrufen und Festlegen des Datums, wie in der folgenden Tabelle dargestellt

2.8.2. String-Objekt

ist ein von JavaScript bereitgestelltes String-Verarbeitungsobjekt. Es kann nur nach der Erstellung einer Objektinstanz referenziert werden. Es stellt Eigenschaften und Methoden zur Verarbeitung von Strings bereit. Die Details sind wie folgt:
Eigenschaftslänge – Gibt die Anzahl der Zeichen in der Zeichenfolge zurück.
Hinweis: Auch ein chinesisches Schriftzeichen ist ein Schriftzeichen! !

2.8.3.Math-

Objekteigenschaften:

Mathematische Objektmethoden:

Trigonometrische Funktionen (sin(), cos(), tan(), asin(), acos(), atan(), atan2()) geben Werte im Bogenmaß zurück. Sie können Bogenmaß in Grad umrechnen, indem Sie Math.PI durch 180 dividieren oder andere Methoden anwenden.

Beispiel 1: Schreiben Sie eine Funktion, die eine zufällige Ganzzahl von min bis max zurückgibt, einschließlich min, aber ohne max.

Funktion getRandomArbitrary(min , max) {
  return min + Math.random() * (max - min);}

Beispiel 2: Schreiben Sie eine Funktion, um eine zufällige Zeichenfolge der Länge n zu generieren. Der Wertebereich der Zeichenfolgen umfasst 0 bis 9, a bis z, A bis Z

Funktion getRandomInt(min, max) {
  return min + Math.floor(Math.random() * (max - min + 1));}function randomStr(n){
  var dict = '1234567890abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ';
  var str = '';
  for(i = 0; i < n;i++){
    str += dict[getRandomInt(0,62)];
  }
  return str;}var str = getRandStr(10);console.log(str);

Klassifizierung des

Array-Objekts

1. Zweidimensionales Array Das Wesen eines zweidimensionalen Arrays besteht darin, dass die Elemente im Array auch Arrays sind.

arr

2

von Spalte 2 und Zeile 1 von a

beginnend bei 0 Der nicht zusammenhängende Startindex des Arrays. In Arrays mit geringer Dichte ist der Wert des Längenattributs im Allgemeinen größer als die tatsächliche Anzahl der Elemente (ungewöhnlich).
Beispiel

var a=["a","b",,,"c",,];

Array-Objektattribut

1.length erstellt:

Alert(arr.length=15); /Erhöhen Sie die Länge des Arrays. Das Längenattribut ist

variabel

.

Die Prototypeigenschaft ist allen Objekten gemeinsam.
Objektname.Prototyp
Der Parameter objectName ist der Name des Objektobjekts.
Beschreibung: Verwenden Sie das Prototypattribut, um eine Reihe grundlegender Funktionen der Objektklasse bereitzustellen. Neue Instanzen eines Objekts „erben“ die dem Prototyp des Objekts zugewiesenen Operationen.
Für Array-Objekte verwenden Sie das folgende Beispiel, um die Verwendung des Prototyp-Attributs zu veranschaulichen.
Fügen Sie dem Array-Objekt eine Methode hinzu, die den maximalen Elementwert im Array zurückgibt. Um dies zu erreichen, deklarieren Sie eine Funktion, fügen Sie sie zu Array.prototype hinzu und verwenden Sie sie.

Funktion array_max( ){
   var i, max = this[0];
   for (i = 1; i < this.length; i++){
       if (max < this[i])
       max = dies[i];
   }
   return max;}Array.prototype.max = array_max;var x = new Array(1, 2, 3, 4, 5, 6);var y = x.max( );

3.constructor attribute

Das Konstruktorattribut repräsentiert das erstellte Objektfunktion.
object.constructor //object ist der Name des Objekts oder der Funktion.
Beschreibung: Das Konstruktorattribut ist Mitglied aller Objekte mit Prototyp. Sie umfassen alle nativen JScript-Objekte mit Ausnahme von Global- und Math-Objekten. Das Konstruktorattribut enthält einen Verweis auf die Funktion, die eine bestimmte Objektinstanz erstellt.

Zum Beispiel:

x = new String("Hi");if (x.constructor == String) // Prozess (Bedingung ist wahr). //oder Funktion MyFunc {// Funktionskörper. }y = new MyFunc;if (y.constructor == MyFunc) // Prozess (Bedingung ist wahr).

Array-Objektmethode <br/> Beschreibung: Ein Teil davon ist eine neue Funktion von ECMAScript5 (nicht unterstützt von IE678).

erklärt hauptsächlich einige neue Funktionen

von concat
Die Funktion von concat besteht darin, Arrays zu verbinden. Es ist zu beachten, dass ein Array-Element auch als gespleißtes Element verwendet werden kann. In diesem Fall wird das Array abgeflacht und dann mit anderen Elementen zusammengefügt, um ein neues Array zu bilden , aber es wird nicht zweimal abgeflacht. Concat verändert das ursprüngliche Array nicht.

Zum Beispiel:

var arr=[1,2,3,4,5];arr.concat([10,11],13);//[1,2,3,4,5,10,11,13] arr .concat([1,[2,3]]);//[1,2,3,4,5,1,[1,3]]

Slice
Slice (a, b) a und b können negative Zahlen annehmen, was bedeutet, dass ein Array von Position a bis Position b abgefangen wird. Es handelt sich um ein Intervall, das links geschlossen und rechts offen ist Wenn es sich um eine negative Zahl handelt, bedeutet dies, dass die letzten a/b-Elemente

var arr=[1,2,3,4,5];arr.slice(1,3);//[2,3]arr sind. Slice(1);//[2,3,4, 5]arr.slice(1,-1);//[2,3,4]arr.slice(-4,-3);//[2 ]

Spleiß
splice entfernt Elemente und fügt dem Array neue Elemente hinzu
object.splice(a) löscht ein Element von links
object.splice(a, b) fängt b Elemente ab Position a ab

var arr=[1,

ändert.

2 ,3,4,5];arr.splice(2);//[3,4,5]arr;//[1,2];Das ursprüngliche Array wurde geändert var arr=[1,2,3 ,4 ,5];arr.splice(2,2);//[3,4]arr;//[1,2,5];var arr=[1,2,3,4,5];arr .splice (1,1,'a','b');//[2]arr;//[1,"a","b",3,4,5]

;
Die Funktion foreach() durchläuft das Array vom Anfang bis zum Ende. Es gibt drei Parameter: Array-Elemente, Index der Elemente und das Array selbst

var arr = [1, 2, 3, 4, 5]; elements , der Index des Elements, das Array selbst console.log(x + '|' + index + '|' + (a === arr));});// 1|0|true// 2| 1|wahr/ / 3|2|wahr// 4|3|wahr// 5|4|wahr

reduce()
Die Funktion „reduce()“ des Arrays muss auf [x1, x2, x3...] dieses Arrays angewendet werden, um das Ergebnis fortzusetzen und eine kumulative Berechnung mit dem nächsten Element der Sequenz durchzuführen ist:

[x1, x2, x3, x4].reduce(f) = f(f(f(x1, x2), x3), x4)

var arr = [1, 2, 3];var sum = arr.reduce ( Funktion(x, y) {
     return x + y}, 0); //Parameter 0 ist optional. Wenn Parameter 0 geschrieben wird, sind die beiden Werte, die zum ersten Mal übergeben werden, 0 und 1. Wenn nicht, sind es die ersten beiden Werte Zum ersten Mal werden die ersten beiden Werte des Arrays übergeben, das Berechnungsergebnis ist 6arr; //[1, 2, 3]arr = [3, 9, 6];var max = arr. Reduzieren(Funktion(x, y) {
     console.log(x + „|“ + y);
     return x > y ? x : y;});// 3|9// 9|6max

;

Vergleich von Arrays und Zeichenfolgen

2.9.JSON

2.9.1.stringify()

wird

zum Serialisieren von JSON-Strings verwendet

={name:"xiaoming",age:12}var json=JSON.stringify(person); //{"name":"xiaoming",age":12}

Zusätzlich zum Akzeptieren von Objekten stringify() möglich Akzeptieren Sie auch 2 Parameter. Der erste Parameter ist ein Filter, der eine Array-Sammlung von Objekteigenschaften oder eine Funktion sein kann. Der zweite Parameter ist eine Option, die angibt, ob der eingerückte

Array-Filter im JSON-String beibehalten werden soll:

json=JSON.stringify( person,['name']); //{"name": "xiaoming"}

Funktionsfilter:

json=JSON.stringify(person,function(key,value){
    Schalter(Taste){
        Fall „Name“:
           Rückgabewert+",wang";
        Fall „Alter“:
           undefiniert zurückgeben;
        Standard:
           Rückgabewert;
    }});//{"name": "xiaoming,wang"}

Beachten Sie, dass dieses Attribut ignoriert wird, wenn die Funktion undefiniert ist:

json

=JSON.stringify(person,null,4);
    „name“: „xiaoming“,
    "age": 12}

2.9.2.toJSON()

Methode toJSON() zum Objekt hinzufügen:

var person={
    Name: „xiaoming“,
    Alter: 12,
    toJSON:function(){
        return this.name+" is "+this.age;
    }}json=JSON.stringify(person);console.log(json); //"xiaoming is 12"

2.9.3.parse()

Neben der Annahme einer JSON-Zeichenfolge kann parse() auch einen Funktionsparameter akzeptieren. Diese Funktion akzeptiert zwei Werte, einen Schlüssel und einen Wert

; :"xiaoming","age":12}',function(key,value){
    if(key=="age"){
        Rückgabewert+10;
    }
    anders{
        Rückgabewert;
    }});

2.10.Ajax

2.10.1. Erstellungsschritte:

1. Erstellen Sie ein asynchrones XMLHttpRequest-Objekt
2. Legen Sie die Anfragemethode und die Anfrageadresse fest
3. Als nächstes verwenden Sie „Senden“, um die Anfrage zu senden
4. Überwachen Sie Statusänderungen
5. Empfangen Sie abschließend die zurückgegebenen Daten.

Beispiel:

const xhr = new XMLHttpRequest()xhr.open('GET', './data/test.json', true)xhr.onreadystatechange = function () {
  if (xhr. readyState === 4) {
    if (xhr.status === 200) {
      console.log(JSON.parse(xhr.responseText))
    } anders {
      console.log('Andere Situationen...')
    }
  }}xhr.send()

2.10.2.Ajax-Anwendung in jQuery

$.ajax({
                    Typ: „post“, // URL der Anforderungsmethode: „a.php“, // Die Linkadresse des Servers dataType: „json“, // Das Format zum Senden und Empfangen von Daten:{
                        Benutzername: „James“,
                        Passwort: „123456“
                    },
                    success:function(data){//Function console.log(data) wird aufgerufen, wenn Daten erfolgreich empfangen werden;//data sind die vom Server zurückgegebenen Daten},
                    error:function(request){//Die Funktion, die aufgerufen wird, wenn die Datenanforderung fehlschlägt. warning("Ein Fehler ist aufgetreten:"+request.status);
                    }});

2.10.3.GET-Methodenstruktur

$

.get(url, [data], [callback], [type])

Parametererklärung:

//Schritt 1: Ein asynchrones Objekt erstellen var ajax = new XMLHttpRequest(); //Schritt 2: Legen Sie die URL-Parameter der Anfrage fest. Der erste Parameter ist der Typ der Anfrage und der zweite Parameter ist die angeforderte urlajax.open( "get", "users.json");//Schritt 3: Senden Sie eine Anfrage ajax.send();//Schritt 4: Registrieren Sie das Ereignis onreadystatechange Wenn sich der Status ändert, ajax.onreadystatechange = function () {.
    if (ajax.readyState == 4 && ajax.status == 200) {
        //Schritt 5: Wenn Sie dieses Urteil eingeben können, bedeutet dies, dass die Daten perfekt zurückgegeben wurden und die angeforderte Seite vorhanden ist. console.log(ajax.responseText); //Geben Sie den Inhalt der Antwort ein}}

; POST-Methode

Sie hat die gleiche Struktur und Verwendung wie die $.get()-Methode, es gibt jedoch immer noch einige Unterschiede

zwischen get und post

1. Post ist sicherer als get; Die Anforderungsparameter werden an die Rückseite der URL gespleißt, die Sicherheit ist gering. Bei der Anforderung im Post-Modus werden die Anforderungsparameter in den Anforderungstext eingeschlossen, was sicherer ist.
2. Mengenunterschied: Die von der Get-Methode übertragene Datenmenge ist gering und darf 2 KB nicht überschreiten, während die von der Post-Methode angeforderte Datenmenge groß ist und keine Begrenzung besteht.
3. Übertragungsgeschwindigkeit: Die Übertragungsgeschwindigkeit von Get ist höher als die von Post
Da die Verwendungsmethode dieselbe ist, kann das Programm zwischen GET-Anfragen und POST-Anfragen wechseln, solange die jQuery-Funktion geändert wird.

2.11.Cookie

2.11.1.js Cookie-Lesevorgangsfunktion

getCookie(c_name){ if (document.cookie . length>0){ //Überprüfen Sie zunächst, ob das Cookie leer ist. Wenn es leer ist, geben Sie „“ zurück. c_start=document.cookie.indexOf(c_name + „=") //Überprüfen Sie, ob das Cookie über indexOf() vorhanden ist. des String-Objekts. Wenn es nicht existiert, ist es -1 if (c_start!=-1){ c_start=c_start + c_name.length+1 // Das letzte +1 stellt tatsächlich die Zahl „=“ dar und erhält so die Startposition des Cookie-Werts c_end= document.cookie.indexOf(";",c_start) //Eigentlich war mir etwas schwindelig, als ich zum ersten Mal den zweiten Parameter von indexOf() sah. Später fiel mir ein, dass es sich um den angegebenen Anfang handelt Indexposition ... Dieser Satz dient dazu, die Endposition des Werts abzurufen. Da Sie überlegen müssen, ob es sich um das letzte Element handelt, können Sie beurteilen, ob das Zeichen „;“ vorhanden ist, wenn (c_end==-1) c_end=document.cookie.length　
return unescape(document.cookie.substring(c_start,c_end)) //Der Wert wird durch substring() erhalten. Wenn Sie unescape() verstehen möchten, müssen Sie zunächst wissen, was escape() tut. Dies ist eine sehr wichtige Grundlage. Wenn Sie mehr wissen möchten, können Sie auch die Details der Cookie-Codierung erklären der Artikel} } return "" }

2.11.2 .Cookie einfacher Speichervorgang

$.cookie("groupCode",222)

2.11.3.Cookie-Einstellung der Ablaufzeit

document.cookie = "name=value;expires=date"

2.11.4 .Cookie-Änderung

document.cookie = "username=zhangsan";document.cookie = "username=lisi";var Cookies = document.cookie;console.log(cookies);

2.11.5.Cookie-Löschungdocument.cookie

= "username=zhangsan ";document.cookie = "Benutzername=; läuft ab=Do, 01. Januar 1970 00:00:00 GMT";var Cookies = document.cookie;console.log(cookies);

2.12. Schleife

2.12.1. for-Schleife

für is Die am häufigsten verwendete Schleife wird hauptsächlich zum Schleifen von Arrays verwendet

let arr = [1,2,3];for (let i=0; i<arr.length; i++){
 console.log(i,arr[i])}// 0 1// 1 2// 2 3

2.12.2.Array.forEach()

Syntax: arr.forEach(callback(currentValue [, index [, array]])[, thisArg]);

Callback ist eine Funktion, die für jedes Element im Array ausgeführt wird. Die Funktion empfängt drei Parameter: currentValue (das aktuelle Element, das im Array verarbeitet wird), Index (der Index des aktuellen Elements, das im Array verarbeitet wird). ), array (Das Array, mit dem die forEach()-Methode arbeitet)

thisArg ist der Wert, der als this verwendet wird, wenn die Callback-Funktion callback ausgeführt wird.

let arr = [1, 2, , 3]let arrCopy1 = []arr.map((item, index, arr) => {
     arrCopy1.push(item * 2)})console.log(arrCopy1)// [2, 4, 6]

forEach() führt die Callback-Funktion einmal für jedes Array-Element aus. Gelöschte oder nicht initialisierte Elemente werden übersprungen (z. B. bei Arrays mit geringer Dichte). )
Im Gegensatz zu Map() und Reduce() hat es keinen Rückgabewert und gibt immer undefind zurück.
ForEach() hat keine andere Möglichkeit, die forEach()-Schleife abzubrechen oder zu verlassen, als eine Ausnahme auszulösen.

2.12.3.while

Die while-Anweisung kann eine Schleife ausführen, um einen bestimmten Codeabschnitt unter der Voraussetzung auszuführen, dass ein bestimmter bedingter Ausdruck wahr ist, bis die Schleife endet, wenn dieser Ausdruck nicht wahr ist.

Beispiel:

let n = 0; 3) {
  n++;}console.log(n);//erwartete Ausgabe: 3Hinweis

: Verwenden Sie die break-Anweisung, um die Schleife zu stoppen, bevor das Ergebnis der Bedingungsauswertung wahr ist.

2.12.4.do…while

Die do…while-Anweisung erstellt eine Schleife, die ausgeführt wird Die angegebene Anweisung, bis der Bedingungswert falsch ist. Erkennen Sie die Bedingung nach der Ausführung der Anweisung, sodass die angegebene Anweisung mindestens einmal ausgeführt wird.

Beispiel:

const list = ['a', 'b', 'c']let i = 0do {
  console.log(list[i]) //Wert
  console.log(i) //index
  i = i + 1} while (i <list.length)

2.12.5.Für

… in

der für… in Schleife kann verwendet werden

Hauptsächlich zum Durchqueren des Objekts

.
  console.log (Eigenschaft) // Eigenschaftsname
  Console.log (Objekt [Eigenschaft]) // Eigenschaftswert}

Verwandte Empfehlungen: JavaScript -Lern -Tutorial

Die obige ist eine detaillierte Zusammenfassung von JavaScript -Lernkenntnissen.