Ich fasse für mich zusammen, weil ich auf diese Weise leichter bzw. schneller lerne. Außerdem muss ich zuerst mal verstehen, WARUM gewisse Befehle angegeben werden müssen und welche Funktion sie haben, weil ansonsten verstehe ich nur Bahnhof. Wobei ich natürlich einiges schon kenne, aber trotzdem aufschreiben möchte.
Es wird eine Weile dauern, doch ich werde versuchen diese Zusammenfassung nach und nach zu erweitern.

Einstieg in Javascript

Javascript Anweisungen müssen zunächst in den HTML-Code eingebunden werden. Das Script kann entweder im Header- oder im Bodybereich eingefügt werden. Wird das Script bspw. im Header eingebunden, so wird es bevor sich die Website öffnet ausgeführt.
Das Script ist mittels eines -Tags anzugeben und all das was sich in diesen Container befindet ist ein Script. Damit verständlich wird, um welche Scriptsprache es sich handelt, kann man dies über den Parameter „language“ angeben, wodurch der Befehl lautet:

Der Script-Typ wird mittels“type“ angegeben.

Beispiel:

Wird zum Beispiel eine separate Scriptdatei verwendet, so muss man das ebenfalls im Code angeben und zwar durch das Attribut „src„, das auf den Pfad zur separaten Datei hinweist:
<script language=“javascript“ type=“text/javascript“ src=“meineFunktion.js“>

Elementare Grundstrukturen von Javascript

Variablen
Arrays
Datentypen
Operatoren
Ausdrücke
Anweisungen
Kommentare

Variablen

Variablen werden mit const, let oder var deklariert und sind ein Speicher oder Platzhalter , denen zur Laufzeit eines Scripts über das Gleichzeichen temporär Werte zugeordnet werden können. Angesprochen werden diese Variablen über Namen, die sie vorher zugewiesen bekommen haben.

Hier ein Beispiel zu einer Variable ohne Typ und ohne Wert:

var Hanswurst;

Hier ein Beispiel zu einer Variable mit Wertzuweisung:

var Hanswurst =50;

Die Variable Hanswurst wird somit als Zahl festgelegt und erhält den Wert 50.

Nun ein kleines Übungsbeispiel:

HTML:

Javascript:

document.write(„<BR>“) legt den Zeilenumbruch fest.

Ergebnis im Browser:

Im weiteren Beispiel wird dem Wert eine Zahl hinzugefügt, wodurch sich das Endergebnis ändert, bzw. erhöht:

Ergebnis:

Arrays

Ein Array ist eine Sammlung von Variablen, die jeweils mittels eines Namens gekennzeichnet sind und dienen dazu eine Reihe von gleichartigen Informationen zu speichern, wie zum Beispiel die Tage eines Monats.

Beispiel:

var Dies_ist_Tag_1 = 1;
var So_ein_Tag_2 = 2;
var Noch_ein_Tag = 3;
var Undnocheiner = 4;
var Tag_5 = 5;
var Und_hier_Tag_6 = 6;
var Tag_7 = 7;
…
var Jetztwirdeszweistellig = 10;
var Tag_11 = 11;
…
var Tag_28 = 28;
var Tag_29 = 29;
var Tag_30 = 30;

Der Unterschied eines Arrays ist – im Vergleich zu einer herkömmlichen Variable – dass man neben dem Namen, noch die Anzahl von Elementen angeben- oder ein Kennzeichen setzen muss, dass es sich um ein Array handelt. Zudem wird zur Erzeugung dessen ein Schlüsselwort namens „new“ verwendet.

Beispiel:

var Tag_im_April = new Array(30);

Wenn man einem Element eines Arrays einen Wert zuordnen möchte, dann muss man diesen in einer eckigen Klammer angeben:

var Tag_im_April [ 0 ] = 1;
var Tag_im_April [ 1 ] = 2;
…
var Tag_im_April [ 29 ] = 30;

Die vier Grundtypen von Variablen

Object
Number
Boolean
String

Object = Kann einen Wert eines beliebigen Typs enthalten. In der Regel dient „Object“ zum Speichern von Instanzen von Klassen.

Number = Diese Variable kann einen Dezimal- oder einen Gleitkommawert enthalten. Sie angegebenen Zahlen müssen anstelle des Kommas einen Punkt enthalten.

Boolean = Bei diesem Variablentyp wird nur entweder „true“ oder „false“ angegeben.

String = Dieser Typ der Variablen kann normalen Text sowie auch Zahlen beinhalten.

Schlüsselworte

Bei Schlüsselwörtern in Javascript, handelt es sich um sogenannte „reservierte Wörter“ (reserved words), die nicht als Name für einen Bezeichner verwendet werden dürfen, weil ansonsten die Ausführung des Programms verhindert wird. Aus diesem Grund muss man bei der Namensgebung eines Bezeichners darauf achten, dass es sich dabei nicht um ein Schlüsselwort, bzw. um ein reserviertes Wort handelt.

Reservierte Wörter (aus SELFHTML-Wiki)

Reserviertes Wort	Erläuterung
`break`	Teil einer Abbruchanweisung. Wird verwendet in Schleifen und bei switch.
`case`	Für Fallunterscheidungen mit switch.
`catch`	Wird bei der Fehlerbehandlung mit try und catch verwendet.
`class`	Für die Definition einer Klasse (ES6).
`const`	Leitet die Deklaration einer oder mehrerer Konstanten ein.
`continue`	Teil einer Fortsetzungsanweisung.
`debugger`	Definiert einen Haltepunkt im Programm für Debugger.
`default`	Standardklausel bei switch. Auch verwendet bei Standardexport in einem Modul.
`delete`	Operator zum Löschen von Objekteigenschaften.
`do`	Für Schleifen mit do und while.
`else`	Teil einer bedingten Anweisung mit if.
`export`	Wird bei der Deklaration eines Exports in einem Modul verwendet.
`extends`	Mit dem Schlüsselwort extends kann eine abgeleitete Klasse definiert werden.
`finally`	Kann bei der Fehlerbehandlung mit try und catch verwendet werden.
`for`	Wird in verschiedenen Schleifen verwendet.
`function`	Schlüsselwort zur Definition einer Funktion.
`if`	Für bedingte Anweisungen.
`import`	Wird verwendet bei der Deklaration eines Imports aus einem Modul.
`in`	Operator in einem relationalen Ausdruck. Auch verwendet in einer Schleife mit for.
`instanceof`	Hiermit kann geprüft werden, ob ein Objekt eine Instanz eines Konstruktors ist.
`new`	Operator für den Konstruktorenaufruf.
`return`	Teil der Rückgabeanweisung einer Funktion.
`super`	Schlüsselwort zum Methoden- oder Konstruktorenaufruf in Objekt oder abgeleiteter Klasse.
`switch`	Für Fallunterscheidungen.
`this`	Eingebaute Kontextvariable von Funktionen.
`throw`	Erzeugt eine benutzerdefinierte Ausnahme.
`try`	Wird bei der Fehlerbehandlung mit try und catch verwendet.
`typeof`	Operator, der den Datentyp des Operanden zurückgibt.
`var`	Schlüsselwort für die Deklaration einer oder mehrerer Variablen.
`void`	Wertet den Ausdruck auf der rechten Seite aus und gibt standardmäßig undefined zurück.
`while`	Wird bei Schleifen verwendet.
`with`	Kann verwendet werden, um mehrere Anweisungen mit einem Objekt durchzuführen.
`yield`	Pausiert die Ausführung einer Generatorfunktion.

Weitere Schlüsselwörter, die nicht als Name für einen Bezeichner verwendet werden sollten:

Reserviertes Wort	Erläuterung
`let`	Leitet die Deklaration einer oder mehrerer Variablen ein.
`static`	Wird verwendet um innerhalb einer Klasse eine eigene Methode zu definieren.

Reserviertes Wort	Erläuterung
`null`	Repräsentiert die beabsichtigte Abwesenheit eines Wertes.
`false`	Boolescher Wert, der für falsch steht.
`true`	Boolescher Wert, der für wahr steht.

implements
interface
package
private
protected
public

Anweisungen

Heute habe ich mein erstes Javascript in meinem HTML-Code eingefügt.
Es handelt sich dabei um eine einfache Funktion, bei der sich beim Laden der Seite, eine Meldung öffnet, in der „Hallo Welt!“ steht.

javascript_hallo_welt

HTML:

html javascript

Dadurch, dass es sich um ein einfaches Text-Script handelt, sollte der Befehl korrekterweise so lauten:

textscript

Wenn das Script separat abgespeichert wird, dann lautet der Befehl im HTML-Code so, insofern die js-Datei im selben Ordner liegt wie die html-Datei:

und in der .js Datei wird nur die Funktion eingegeben:

js textscript

CSS:

css javascript

Als Texteditor verwende ich immer Notepad++ , da ich damit die Dateien nebeneinander legen und gleichzeitig anschauen kann. Ein einfaches aber sehr cooles Programm