CSS, HTML und Javascript mit {stil}

Javascript Variablen, Objekte, Funktionen

Javascript Programmierung

Wer Javascript als erste Programmiersprache lernt, muss sich mit den Konzepten von Datentypen wie Zahl oder Zeichenkette (Number oder String), Anweisungen oder Befehlen, Operatoren von Plus bis Größer Gleich, Variablen und Funktionen vertraut machen.

Die grundlegenden Konzepte von Javascript werden in der ECMAScript Language Specification festgelegt. Darüber hinaus beinhaltet Javascript je nach Anwendung – HTML-Seiten, SVG oder XML, eBooks, Photoshop und Postscript – Schnittstellen zum jeweiligen Dokumententyp (z.B. Webseiten, PDF, Grafik).

Programme agieren auf Daten. Diese Daten können Zahlen wie »42« oder ein String wie »Peter Schmitz« sein. Programme untersuchen Daten und ändern sie – sie berechnen die Summe von zwei Zahlen oder prüfen, ob der String eine Emailadresse ist.

Folgen von Anweisungen, die das Script mehrfach braucht, werden in Funktionen zusammengefasst.

Datentypen: Boolean, Number und String

Javascript hat nur einen kleinen Satz von primitiven (nicht zusammengesetzten) Datentypen: Boolean, Number und String und die speziellen Werte null und undefined. Alles andere sind Varianten des Typs Object eines zusammengesetzen Datentyps.

var a = 42;              // Zahlen wie 42 oder 4,98
var b = true;            // Boolesche Werte: true oder false
var c = "Lorem Ipsum";   // String – Zeichenkette 
undefined                // z.B. Variablen denen noch kein Wert zugewiesen wurde
null                     // beschreibt einen Nullwert

Operatoren

Berechnen oder Vergleichen von Werten: Plus, Minus, Mal, Modulo, ist gleich, größer gleich

summe + steuer

Anweisungen

Nahezu jede Zeile Javascript ist eine Anweisung oder Befehl. Anweisungen deklarieren und initialisieren Variablen, berechnen und ändern die Werte von Variablen, rufen Methoden und Funktionen auf und treffen Entscheidungen.

while (clicks < 10) {
    Anweisung; 
    Anweisung; 
    Anweisung; Anweisung;
}

Variablen

Variablen werden in Javascript durch die var-Anweisung definiert. Variablen müssen deklariert werden, bevor sie benutzt werden können. Wenn sie innerhalb einer Funktion definiert werden, gelten mit var definierte Variablen nur innerhalb der Funktion und sind nicht von außerhalb der Funktion zugreifbar.

Konstante

Mit dem Schlüsselwort const werden Konstanten definiert, die im Programm nur gelesen, nicht aber verändert werden können.

const mwst = 16; 

Literale

Literale stellen Werte dar. Im Gegensatz zu Variablen sind Literale feste Werte, die dem Script sozusagen wörtlich übergeben werden.

  • Array-Literal var farben = ["rot", "grün", "blau"];
  • Boolean-Literal var isIn = true und var isIn = false
  • Floating-Point Literal var pi = 3.1415
  • Integer-Literal var antwort = 42
  • Objekt-Literal var adress = { name: "Hansen", ort: "Bonn", plz: 4711 }
  • String-Literal var lamm = "bähbäh";

Funktionen

Funktionen sind ein Stück Code, das einmal definiert wird und im Programm mehrfach aufgerufen werden kann – Funktionen sparen aufwändige und fehlerträchtige Doppelprogrammierung und strukturieren gleichzeitig das Programm ähnlich wie die Kapitel eines Buches. Zuguterletzt verhindern Funktionen, dass Code automatisch beim Laden des Dokuments ausgeführt wird – Funktionen werden erst beim expliziten Aufruf der Funktion geladen.

function summe(x, y) {
    return x + y;
}

var result = summe (42, 18);

Blöcke

Blöcke von geschweiften Klammern bilden keinen Scope. Scope ist die Bezeichnung für die Umgebung, innerhalb der die dort definierten Variablen gelten. Der einzige Scope in Javascript wird durch Funktionen gebildet.

Objekte

Javascript ist eine objektorientierte Programmiersprache. Der Schlüssel zu einem schnellen Verständnis von Javascript liegt in der Struktur seiner Objekte. Javascript enthält nur wenige Funktionen, die nicht Teil eines Objekts sind.

Objekte bestehen aus

  • Methoden (Funktionen),
  • Eigenschaften (Daten oder andere Objekte),
  • Ereignisse, die an ein Objekt gebunden sind.

Objekte realisieren einfache Datenstrukturen wie Strings und komplexe Datenstrukturen – z.B. ein Adressbuch mit hoher Funktionalität.

var myObject = { firstName: "Monika", lastName: "Schulze", city: "Neudorf" };

Javascript kann auf eine große Anzahl von eingebauten Objekten zurückgreifen, die Charakteristika des Webdokuments darstellen. Das wichtigste Objekt ist das DOM, das Document Object Model.

Das globale Objekt ist der Hüter aller Funktionen und Variablen, die nicht innerhalb anderer Funktionen und Objekte definiert wurden. Das globale Objekt hat keinen expliziten Namen.

Komplexe Datentypen

Javascript Arrays
sind geordnete Sammlungen von logisch zusammengehörigen Elementen, die mit einem einzigen Namen angesprochen werden.
var farben = new Array("rot", "grün", "blau");
Javascript Funktionen
sind Datentypen in Javascript – d.h., sie können behandelt werden, als würden sie Werte enthalten, die geändert werden können.
var total = sum(40, 2);
Javascript Objekte
sind Behälter für Werte und Funktionen – komplexe Datentypen, die individuell für besondere Anforderungen konstruiert werden.
var adress = new Object();

Reservierte Wörter

Die meisten reservierten Wörter werden in JavaScript überhaupt nicht benutzt. Reservierte Wörter können nicht

  • als Name in einer literalen Objekt-Notation
  • als Name eines Mitglieds in einer dot-Notation
  • als Argument einer Funktion
  • als Variable
  • als unqualifizierte globale Variable
  • als Sprungmarke

benutzt werden

abstract
boolean
break
byte
case
catch
char
class
const
continue
debugger
default
delete
do
double
else
enum
export
extends
false
final
finally
float
for
function
goto
if
implements
import
in
instanceof
int
interface
long
native
new
null
package
private
protected
public
return
short
static
super
switch
synchronized
this
throw
throws
transient
true
try
typeof
var
void
volatile
while
with