ITG-Wiki

Diese Seite ist nicht editierbar. Sie können den Quelltext sehen, jedoch nicht verändern. Kontaktieren Sie den Administrator, wenn Sie glauben, dass hier ein Fehler vorliegt.
======  Lektion 2: JavaScript Grundlagen ======
Wie gesehen, kann in der Entwickler-Konsole JavaScript Code direkt ausgeführt werden. Es lassen sich Berechnung und andere Operationen durchführen. Beim Ausführen von Code, wird das Ergebnis der letzten Operation, in der JavaScript-Konsole ausgegeben. 

JavaScript Zeilen werden mit einem ";" beendet (Wie in PHP).

===== Operatoren =====
Für Berechnungen stehen bekannt Rechenoperatoren zur Verfügung: "+, -, *, /". Weiterhin gibt es den Modulo-Operator "%", dieser liefert den Rest einer ganzzahligen Division (5 % 3 ergibt 1 - weil 7 durch 2 ergibt 3 Rest 1).

<code javascript>
5 + 5;
5 * 5;
// Konsolenausgabe 25
</code>
Nur eine Ausgabe!

<code javascript>
console.log(5 + 5);
console.log(5 * 5);
console.log(5 - 5);
console.log(25 / 5);
console.log(26 / 5);

console.log(25 % 5);
// Konsolenausgabe 0
console.log(26 % 5);
// Konsolenausgabe 1
</code>

===== Datentypen =====
Es gibt 5 Datentypen in JavaScript: "String, Number, Boolean, Array, Object"
  * String \\ Text: "Hallo"
  * Number \\ Zahl: 17
  * Boolean \\ Wahrheitswert: true oder false
  * Array \\ Liste von Werten: [1, 2, 3]
  * Object \\ Object mit weiteren Eigenschaften (Später)

<code javascript>
console.log("Hallo");
console.log(17);
console.log(true);
console.log([1, 2, 3]);
</code>

Strings können mit doppelten oder einfachen Anführungszeichen geschrieben werden. Werden einfache Anführungszeiche in einem String mit doppelten genutzt, werden diese als Text interpretiert.
<code javascript>
"Hallo";
'Hallo';

'Good "bye"';
"Good 'bye'";
</code>
Zahlen können Ganz oder Dezimal sein: 1 oder 1.0. Dezimalzahlen werden in der Informatik grundsätzlich mit einem "." und nicht mit einem "," beschrieben.
Boolean können die Werte true (Wahr) oder false (Falsch) annehmen.
Listen können mehrere Werte enthalten und werden mit eckigen Klammern geschrieben: [1, "Hello", true].

Mit dem ''typeof'' kann der Datentyp getestet werden.
<code javascript>
console.log(typeof "Hallo");   // string
console.log(typeof 17);        // number
console.log(typeof true);      // boolean
console.log(typeof [1, 2, 3]); // object, nicht list
// object ist richtig, aber nicht sehr konsequent
</code>

Jetzt wird es spannend: JavaScript kann zwei Zahlen addieren, aber es kann auch eine Zahl und einen Text addieren. JavaScript interpretiert ein + dann als Text-Zusammenfügung. 
<code javascript>
console.log(17 + "Hallo");
// 17Hallo
console.log("Hallo" + 17);
// Hallo17
</code>

JavaScript wertet Ausdrücke von Links nach Recht aus, darum gilt
<code javascript>
console.log(17 + 5 + "Hallo");
// 22Hallo
console.log("Hallo" + 17 + 5);
// Hallo175
</code>
In der ersten Zeile wird zuerst 17 + 5 = 22 ausgewertet, dann wird mit dem Text zusammengefügt. Zwischenschritt: 22 + "Hallo" 
Im zweiten Beispiel wird "Hallo" ausgewertet und alles nachfolgende auch als Text interpretiert. Zwischenschritt "Hallo" + "17" + "5"

===== Zusammenfassung =====
In dieser Lektion haben wir die Syntax von JavaScript kennen gelernt. Operatoren und Datentypen wurden vorgestellt und ein paar Besonderheiten angesprochen.

==== Aufgabe ====
  - Probiere ein bisschen in der JavaScript Konsole rum.

[[javascripting:lektion_01|<< Lektion 1: Einführung]] | [[javascripting:lektion_03|Lektion 3: HTML-Manipulation I >>]]