Heim  >  Artikel  >  Web-Frontend  >  Einführung in JavaScript für Anfänger

Einführung in JavaScript für Anfänger

伊谢尔伦
伊谢尔伦Original
2017-06-16 10:05:512184Durchsuche

Javascript ist ein Muss für die Front-End-Entwicklung. Im Folgenden finden Sie die ersten drei Kurse für den Einstieg.

Lektion 1
1: Hauptfunktionen von Javascript
Interpretiert: Kein Kompilieren erforderlich, der Browser interpretiert und führt direkt aus
Objektbasiert: Wir können JS verwenden direkt Objekte, die erstellt wurden
Ereignisgesteuert: Kann ereignisgesteuert auf Client-Eingaben reagieren, ohne das serverseitige Programm zu durchlaufen
Sicherheit: Der Zugriff auf die lokale Festplatte ist nicht zulässig und Daten nicht auf den Server geschrieben werden
Plattformübergreifend: js basiert auf dem Browser selbst und hat nichts mit dem Betriebssystem zu tun

Lektion 2
Wie schreibe ich Javascript in eine Webseite
1 : Javascript direkt in die Seite einbetten
9cc1e8e6d40187c6e71a342c870da16d

 Javascript-Programm
 2cacc6d41bbb37262a98f745aa00fbf0
Javascript kann in der Mitte des 9830b5b6d58ec56568e7c2882e8597599c3bca370b5104690d9ef395f2c5f8d1-Tag,
kann auch in der Mitte von 36cc49f0c466276486e50c850b7e4956-Tags platziert werden.
wird am häufigsten zwischen 93f0f5c25f18dab9d176bd4f6de5d30e9c3bca370b5104690d9ef395f2c5f8d1-Tags platziert

Der Fall ist wie folgt: Fügen Sie den Javascript-Code in 93f0f5c25f18dab9d176bd4f6de5d30e9c3bca370b5104690d9ef395f2c5f8d1 ein.

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>初学javascript</title>
    <script language="javascript">        var now=new Date();//获取Date对象的一个实例
        var hour=now.getHours();//获取小时数
        var min=now.getMinutes();//获取分钟数
        alert("当前时间"+hour+":"+min+"\n欢迎访问柠檬学院http://www.bjlemon.com/");    </script>
</head>
<body>
</body>
</html>

Der Code für Fall 2 lautet wie folgt

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>我的年月日</title>
    <script language="javascript">        var now=new Date();//获取日期对象
        var year=now.getYear()+1900;//获得年,在js中年份需要加1900才可以显示此时此刻的年份
        var month=now.getMonth()+1;//获得月份,月份是0-11,所以在js中需要加1
        var date=now.getDate();//获得日
        var day=now.getDay();//获得星期几
        var day_week=new Array("礼拜日","礼拜一","礼拜二","礼拜三","礼拜四","礼拜五","礼拜六");        var week=day_week[day];        var time="当前时间:"+year+"年"+month+"月"+date+"日"+week;
        alert(time);    </script>
</head>
<body></body>
</html>

2: Referenz auf externes Javascript

Wenn das Skript komplex ist oder derselbe Code auf vielen Seiten verwendet wird, dann können diese Skriptcodes in einer separaten Datei mit der Erweiterung .js abgelegt werden, und dann kann die Javascript-Datei mit der Webseite verknüpft werden, auf der der Code verwendet werden muss

ef4152e5201e782597e56128c8a73fcd
2cacc6d41bbb37262a98f745aa00fbf0
(Empfehlung) Der obige Code wird im Allgemeinen in der Mitte von 93f0f5c25f18dab9d176bd4f6de5d30e9c3bca370b5104690d9ef395f2c5f8d1 geschrieben Dateien mit dem Suffix js müssen keine 3f1c4e4b6b16bbbd69b2ee476dc4f83a2cacc6d41bbb37262a98f745aa00fbf0-Tags zum Einschließen von

77f7724499889f2edf8d98094d11b671 verwenden Seite Die Methode getdate() ist eine in einer Datei definierte Methode mit einem .js-Suffix

Das Suffix ist in diesem Fall .html

Das Suffix ist in diesem Fall .js
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>引用外部的js</title>
    <script language="javascript" src="js1.js">
    </script>
</head>
<body onload="getdate()">
</body>
</html>

Lektion 3
function getdate(){    var now=new Date();//获取日期对象
        var year=now.getYear()+1900;//获得年,在js中年份需要加1900才可以显示此时此刻的年份
        var month=now.getMonth()+1;//获得月份,月份是0-11,所以在js中需要加1
        var date=now.getDate();//获得日
        var day=now.getDay();//获得星期几
        var day_week=new Array("礼拜日","礼拜一","礼拜二","礼拜三","礼拜四","礼拜五","礼拜六");        
        var week=day_week[day];        
        var time="当前时间:"+year+"年"+month+"月"+date+"日"+week;
        alert(time);
    
}
Javascript-Syntax

1:Javascript-Syntax
1.1: js-Variablen unterscheiden zwischen Groß- und Kleinschreibung
usename und useName sind zwei verschiedene Variablen
1.2: Ende von Jede Zeile Das Semikolon ist optional. Wenn am Ende der Anweisung kein Semikolon steht, verwendet js
automatisch das Ende dieser Codezeile als Ende der Anweisung
warning("hello world"). ;
warning(" hello world")
1.3: Variablen sind schwach typisiert
Verwenden Sie beim Definieren von Variablen nur den var-Operator
Zum Beispiel: var usename="biexiansheng";
var age =22;
1.4: Codeblock mit geschweiften Klammern verwenden
{ //Code} Die in geschweiften Klammern eingeschlossenen Anweisungen werden in der Reihenfolge ausgeführt
1.5: Kommentare
1.5.1: Einzeilige Kommentare //
Einzeilige Kommentare verwenden doppelte Schrägstriche. Beginnend mit „//“, ist der Text nach „//“ der Inhalt des Kommentars.
Der Inhalt des Kommentars hat während der Ausführung des Codes keine Auswirkung.
var now=new Date();//Holen Sie sich das Datumsobjekt
1.5.2: Mehrzeiliger Kommentar /**/
Mehrzeilige Kommentare beginnen mit /* und enden mit*/ endet, der Inhalt zwischen den beiden ist der Kommentarinhalt
Es hat während der Codeausführung keine Auswirkung.
/**Funktion: Aktuelles Datum abrufen
*Autor: biexiansheng
*/
Funktion getClock () {
// Inhalt
}

Lektion 4
Datentypen von JavaScript (egal wie viele Datentypen es in JavaScript gibt, Sie können beim Deklarieren nur var verwenden)
1: Numerischer Typ
Ganzzahl: 123 //Dezimal
0123 // Oktal, beginnend mit 0
0x123 // Hexadezimal, beginnend mit 0x (Null, nicht o)
Gleitkommatyp: Der ganzzahlige Teil plus der Dezimalteil kann nur dezimal ausgedrückt werden, ist aber möglich Verwenden Sie die wissenschaftliche Notation
3.1415926 // Standardform der Gleitkommazahl
3.14E9 // Verwenden Sie die wissenschaftliche Notation, um 3,14 mal 10 hoch zur 9. Potenz darzustellen
2: Zeichentyp
Zeichendaten sind eins oder mehr Zeichen in einfachen oder mehreren Anführungszeichen eingeschlossen
Zum Beispiel: 'a' 'hello world'
"a" "hello world"
Keine im Javascript-Char-Datentyp
Wenn Sie ein einzelnes darstellen möchten Zeichen müssen Sie eine Zeichenfolge der Länge 1 verwenden.

Einfache Anführungszeichen einschließlich doppelter Anführungszeichen „hello“
Doppelte Anführungszeichen einschließlich einfacher Anführungszeichen „‚world‘“
3: Boolescher Typ
Boolescher Wert Daten haben nur true oder false. Sie können auch die Ganzzahl 0 verwenden, um false darzustellen, und eine Ganzzahl ungleich 0 verwenden, um true darzustellen.

4: Escape-Zeichen
Nicht anzeigbare Sonderzeichen beginnen mit einem Backslash werden oft Steuerzeichen genannt, auch Escape-Zeichen genannt
bbackspace nline Feed fform Feed tTab Zeichen 'einfaches Anführungszeichen' 'doppeltes Anführungszeichen' \backslash

5: Nullwert
null, verwendet um leere oder nicht vorhandene Referenzen zu definieren
Zum Beispiel var a=null;

6: Undefinierter Wert
Bereits deklariert, aber nicht zugewiesen Variablen
var a;
warning(a );
Popup undefiniert ist ein Schlüsselwort, das zur Darstellung undefinierter Werte verwendet wird

7: Array-Typ
Array-Typ, Ein Array ist eine Sequenz, die grundlegende und kombinierte Daten enthält. In der JavaScript-Skriptsprache entspricht jeder Datentyp einem Objekt und die Daten sind im Wesentlichen ein Array-Objekt var score=[45,56,45,78 ,78,65];
Da Arrays im Wesentlichen Array-Objekte sind , Sie können den Operator new verwenden, um ein neues Array zu erstellen, z. B.
var score=new Array(45,65,78,8,45);
Der Zugriff auf ein bestimmtes Element im Array kann durch erreicht werden die Indexposition des Elements, wie in der folgenden Anweisung gezeigt
Die Variable gibt das 4. Element in der Array-Punktzahl zurück
var m=score[3];

Lektion 5
Definition und Verwendung von Variablen

1: Benennungsregeln für Variablen

Variablennamen bestehen aus Buchstaben, Zahlen und Unterstrichen, dürfen aber nicht mit Zahlen beginnen
Kann keine Schlüsselwörter in Javascript verwenden
Strikt zwischen Groß- und Kleinschreibung unterscheiden
Für Beispiel Benutzername Benutzername
2: Variablendeklaration
Var-Variable
Sie können eine Variable verwenden, um mehrere Variablen zu deklarieren, z. B.
Var jetzt, Jahr, Monat, Datum
Sie können einen Wert zuweisen zu einer Variablen hinzufügen, während Sie sie deklarieren, d Deklarieren Sie eine Variable, ohne einen Wert zuzuweisen. Der Standardwert der Variablen ist undefiniert.

JavaScript ist ein schwacher Typ. Sie müssen den Typ der Variablen beim Deklarieren nicht angeben bestimmt basierend auf dem Wert der Variablen.

Deklaration globaler Variablen: 1: Deklarationen außerhalb der Funktion sind globale Variablen, unabhängig davon, ob eine var-Deklaration vorhanden ist
2: Variablen, die innerhalb der Funktion mit var deklariert werden body sind lokale Variablen und var-Deklarationen werden nicht verwendet. Die Variable ist eine globale Variable

//Wenn Sie einem nicht deklarierten Variablentyp einen Wert zuweisen, verwendet JavaScript automatisch die Variable, um eine Layoutvariable zu erstellen
Zum Beispiel: a="hello world"
funcation test(){
var c="local variable";//Dieses c ist eine lokale Variable und es ist auch die einzige Möglichkeit, eine lokale Variable zu definieren
        b="Alle Variablen";//Dieses b ist auch eine vollständige Variable
                                                       Funktion. test2() > } warning(b);
}

3: Der Gültigkeitsbereich der Variable
Der Gültigkeitsbereich der Variable bezieht sich auf den gültigen Bereich von die Variable im Programm
Alle Variablen: Variablen, die außerhalb aller Funktionen definiert sind und auf den gesamten Code wirken
Lokale Variablen: Variablen, die innerhalb des Funktionskörpers definiert sind und nur auf den Funktionskörper wirken

Lektion 6
Anwendung von Operatoren

1: Zuweisungsoperator

Einfacher Zuweisungsoperator
Zum Beispiel var useName='tom';//Einfacher Zuweisungsoperator
Zusammengesetzter Zuweisungsoperator
a+=b;/ /Entspricht a =a+b;
a-=b;//entspricht a=a-b;
a*=b;//entspricht a=a*b;
a/=b ;//entspricht In a=a/b;
a%=b;//entspricht a=a%b;
a&b=b;//entspricht a=a&b; logische UND-Verknüpfung
a|=b ;//Entspricht a=a|b; logischer ODER-Verknüpfung
a^=b;//Entspricht a=a^b; logischem NICHT-Operator
2: Arithmetischer Operator
+ - * / %
++ Vor ++ zuerst addieren und dann addieren, 0 kann nicht als Teiler verwendet werden, das Schlüsselwort infinity

3 wird zurückgegeben: Vergleichsoperator
> größer als 063b03e5d2221223c5433efff66648ad= größer als oder gleich 778d120d40ca7e89794cacc416d6d5a52true->3->4->2true->3->4
//1->2false->3-> 4->2false Die for-Schleife endet
Beispiel
var sum=0;
for(var i=0;i4af3f2fab1a9805e1324b1d91d3ac5302-> ;1true-> 2... > i++;
}
alarm(i);
3: do-while-Schleifenanweisung
Es kann garantiert werden, dass die Schleife der do-while-Schleife mindestens einmal ausgeführt wird.
Syntaxformat
do{
1 Ausführungsschleifenkörper
}while(2 Beurteilungsbedingung);
1->2true->1->2true....

Hinweis: Die While-Schleife bestimmt zunächst, ob die Bedingung erfüllt ist, und entscheidet dann basierend auf dem Ergebnis der Beurteilung
, ob der Schleifenkörper ausgeführt werden soll.
Die Do-While-Schleife führt den Schleifenkörper zunächst einmal aus und führt ihn dann aus bestimmt, ob die Bedingung wahr ist.
Die do-while-Schleife wird also garantiert mindestens einmal ausgeführt.

Beispiel
var sum=0;
var i=1;
do{
sum+=i;
}while(i<=10);
alarm(sum);

Das obige ist der detaillierte Inhalt vonEinführung in JavaScript für Anfänger. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn