Zum Inhalt springen

JavaScript

aus Wikipedia, der freien Enzyklopädie
Dies ist eine alte Version dieser Seite, zuletzt bearbeitet am 11. Oktober 2004 um 13:04 Uhr durch 83.236.143.38 (Diskussion). Sie kann sich erheblich von der aktuellen Version unterscheiden.

JavaScript ist eine objektorientierte Skriptsprache, die von der Firma Netscape entwickelt wurde, um statischeHTML-Seiten dynamisch zu gestalten. Im Gegensatz zu serverseitigen Scriptsprachen wie zum Beispiel Perl oder PHP wird JavaScript auf dem Client ausgeführt. Mittels einer Schnittstelle zum Document Object Model (DOM) können Elemente der Webseite manipuliert werden, nachdem diese zum Client übertragen wurde.

JavaScript wurde unter dem Namen ECMAScript unter ECMA-262 standardisiert. Die Syntax der Sprache ähnelt der der Programmiersprache Java und auch einige Schlüsselwörter beider Sprachen sind identisch. Semantisch jedoch unterscheiden sich beide Sprachen deutlich. Interessant ist die Tatsache, daß JavaScript im Gegensatz zu klassisch objektorientierten Sprachen keine Klassen einsetzt, sondern statt dessen Objekte als Prototypen einsetzt. Mittlerweile wurden auf dieser Basis zusätzlich normale Klassen implementiert, wohl in der Annahme, damit den Einstieg zu erleichtern.

Datenstrukturen und Objekte

JavaScript kennt mehrere Arten von eingebauten Objekten wie z.B. Object, Screen, Array, String, Date and Math. Andere Objekte gehören zum DOM (window, form, links etc.).

Eigenschaften oder Methoden von Objekten werden über folgende Notation angesprochen:

objektname.feldname
bzw.
objektname.methodenname()

Eine Übersicht der wichtigsten Eigenschaften und Methoden der einzelnen Objekte:

Objekte allgemein

Die Klasse "Object" definiert die gemeinsame Funktionalität aller Javascript-Objekte.

neues Objekt erstellen: 

var obj = new Object();

alternativ: 

var obj = {};

In JavaScript ist es auch möglich, zur Laufzeit neue Eigenschaften zu einem Objekt hinzuzufügen oder zu entfernen. In diesem Beispiel wird "zahl1" mit 1 belegt: 

obj.zahl1 = 1;

Eine weitere Besonderheit der Javascript-Objekte ist die Fähigkeit, den Wert einer Eigenschaft direkt über den Namen zu ermitteln. In diesem Beispiel wird "1" ausgegeben: 

alert ( obj['zahl1'] )

Außerdem ist es möglich, über die Eigenschaften eines Objektes zu iterieren. In diesem Beispiel wird "obj.zahl1=1" ausgegeben. 

for (var i in obj) {
  alert ('obj.' + i + '=' + obj[i])
}

Array

arrayname = new Array(1,2,3,4,5,6)	//neues Array anlegen
arrayname = [1,2,3,4,5,6]	        //neues Array anlegen (Alternative)
arrayname.length                       //Anzahl der Elemente zurückgeben
arrayname.concat(anderesArray)	        //zwei Arrays verbinden
arrayname.join()				//Array in Zeichenkette umwandeln
arrayname.pop()				//letztes Element aus Array löschen
arrayname.push(neuer Wert)		//ein neues Element an das Ende des Array anhängen
arrayname.reverse()				//Reihenfolge der Elemente umkehren

String

...

Date

dateobjekt = new Date()        //neues Date Objekt erzeugen

Math

Math.max(zahl1,zahl2)  //die größere der beiden Zahlen zurückgeben
Math.min(zahl1,zahl2)  //die kleiner der beiden Zahlen zurückgeben
Math.pow(Basiszahl,Exponent)  //Ergebnis der Exponentialrechnung zurückgeben
Math.random()                  //Eine Zufallszahl zwischen 0 und 1 zurückgeben

Window Objekt

window.resizeTo(neueWeite,neueHöhe);        // Fenstergröße einstellen
window.back();                              // vorhergehende Seite anzeigen
window.open("dateiname.htm","Fenstername"); // neues Browserfenster öffnen

Screen Objekt

screen.width                         // Bildschirmbreite zurückgeben
screen.height                        // Bildschirmhöhe zurückgeben

Function Objekt

f = function add (zahl1, zahl2) {
  return zahl1 + zahl2;
}

alternativ: 

f = new Function ('zahl1', 'zahl2', 'return zahl1 + zahl2;');

Kontrollstrukturen

If ... else

  if (Bedingung) {
     Anweisungen;
  }
  else {
     Anweisungen;
  }

While-Schleife

  while (Bedingung) {
     Anweisungen;
  }

Do ... while

  do {
    Anweisungen;
  } while (Bedingung);

For-Schleife

  for ([Startausdruck]; [Bedingung]; [Inkrementier-Ausdruck]) {
     statements
  }

For ... in-Schleife

Mit dieser Anweisung werden alle Eigenschaften eines Objektes durchlaufen (oder auch alle Elemente eines Feldes). 

  for (variable in object) {
     statement
  }

Switch-Ausdruck

  switch (Ausdruck) {
     case marke1 :
        Anweisungen;
        break;
     case marke2 :
        Anweisungen;
        break;
     default :
        Anweisungen;
  }

Funktionen

Eine Funktion ist ein Block mit einer Liste (ev. auch leer) von Parametern, dem ein Name zugewiesen wird. Eine Funktion kann einen Resultatwert zurückgeben. 

  function meineFunktion(param1, param2, param3) {
     Anweisungen;
     return Ausdruck;
  }

Beispiel: Der ursprüngliche Algorithmus von Euklid zur Ermittlung des größten gemeinsamen Teilers: Es ist eine geometrische Lösung; die kleinere Strecke wird jeweils von der größeren abgezogen. 

  function gcd(a, b) {
     while (a != b) { 
        if (a > b) {
           a = a - b;
        } else {
           b = b - a;
        }
     }
     return a;
  }

Die Anzahl der Parameter beim Aufruf muss nicht zwingend mit der Anzahl der Parameter in der Funktionsdefinition übereinstimmen. Wenn beim Aufruf weniger Parameter angegeben werden, dann wird für die übrigen Parameter einfach der Wert undefined eingesetzt. Weiter kann innerhalb der Funktion auch über das arguments-Array auf die Parameter zugegriffen werden.

Konstruktor-Funktionen

Wird eine Javascript-Funktion genutzt, um mit new erstellte Objekte zu initialisieren, spricht man von einem Konstruktor. Innerhalb des Konstruktors kann das neue Objekt über die this-Variable angesprochen werden: 

function MyObject() {
 this.zahl1 = 1;
}

neues Objekt erstellen: 

var obj = new MyObject;

Test der Eigenschaft "zahl1". Es wird "1" ausgegeben. 

alert (obj.zahl1)


private Eigenschaften

Entgegen der vorherrschenden Meinung unterstützt Javascript private Eigenschaften, also Eigenschaften, die nur für das Objekt selbst sichtbar sind, nicht aber für andere Objekte. Im folgenden Beispiel wird die private Eigenschaft zahl1 definiert, die nur durch die private Methode next() ausgelesen und verändert werden kann. 

function MyClass() {
  var zahl1 = 1;
  this.getZahl1 = function () { return zahl1; }
  this.getNext  = function () { return ++zahl1; }
}

neue Instanz der Klasse erstellen: 

var obj = new MyClass;

zahl1 ist von außen nicht zugreifbar, daher wird "undefined" ausgegeben: 

alert(obj.zahl1)

Es wird "1" ausgegeben: 

alert(obj.getZahl1())

Es wird "2" ausgegeben 

alert(obj.getNext())


Vererbung (prototype-Eigenschaft)

Jedes Function Objekt verfügt über eine prototype-Eigenschaft. Diese ist von besonderer Bedeutung, wenn die Funktion genutzt wird, um neue Objekte zu initialisieren (Konstruktorfunktion). Die prototype-Eigenschaft definiert in diesem Falle gemeinsame Eigenschaften aller Objekte, die mit dem Konstruktor erstellt werden. Man spricht von prototyp-basierter Vererbung.

Die prototyp-Eigenschaft eines Function-Objektes kann auch neu definiert werden. Auf diese Weise ermöglicht Javascript mehrstufige Vererbung:

Konstruktor der Basisklasse erstellen: 

function C1 (pName) {
  this.name = pName;
}
C1.prototype.C1    = C1;
C1.prototype.zahl1 = 1;

Konstruktor der abgeleiteten Klasse erstellen: 

function C2 (pName) {
  // Konstruktor der Basisklasse muß explizit gerufen werden:
  this.C1(pName);
}

Eine neue Instanz der Basisklasse dient als Prototyp der abgeleiteten Klasse! Dadurch werden die Eigenschaften des Prototyps der Basisklasse an die abgeleitete Klasse vererbt. 

C2.prototype       = new C1 ()

Hinzufügen der Eigenschaften der abgeleiteten Klasse: 

C2.prototype.C2    = C2;
C2.prototype.zahl2 = 2;

Hinzufügen der Methode "test". Die Funktion gibt die Summe der geerbten Eigenschaften zahl1 und zahl2 aus: 

C2.prototype.test  = function C2_test() {
  alert (this.name + '=' + (this.zahl1 + this.zahl2));
}

Erstellen einer Instanz der Klasse C2: 

var X = new C2('test')

Test der Vererbung. Es wird angezeigt "test=3"! 

X.test();

Eine wichtige booleesche Methode der Klasse Object ist hasOwnProperty(propName). Dadurch läßt sich ermitteln, ob eine bestimmte Eigenschaft durch das Objekt selbst, oder durch seine Prototyp-Kette definiert wird. Zum Beispiel ergibt X.hasOwnProperty('zahl1') false, ebenso wie X.hasOwnProperty('zahl2'). Wird allerdings die Eigenschaft "name" getestet, so liefert X.hasOwnProperty('name') true, denn "name" wurde durch den Konstruktor der Basisklasse C1 belegt.

Benutzerinteraktion

Meist erfolgt die Benutzerinteraktion über HTML-Formulare, auf deren Elemente man über das DOM zugreift. Es gibt jedoch auch einige einfache Arten, direkt mit dem Benutzer zu kommunizieren:

Alarm-Dialog

Gibt ein Fenster mit einer Textmeldung aus. Beispiel: 

 window.alert('Hallo Welt');

Eingabeaufforderung

Es wird ein Dialog zur Informationseingabe angezeigt. Beispiel: 

var eingabe = prompt("Geben Sie einen Text ein","");

andere Interaktionsmöglichkeiten

Fehlerbehandlung

Die neueren Versionen von ECMAScript, wie sie im Internet Explorer 5 und Netscape Navigator 6 eingebaut sind, verfügen über eine von Java übernommene try ... catch Fehlerbehandlungsanweisung.

Die try ... catch ... finally Anweisung fängt Ausnahmen (exceptions), die aufgrund eines Fehlers oder einer throw-Anweisung auftreten, ab. Die Syntax ist wie folgt: 

  try {
     // Anweisungen, in denen Ausnahmen auftreten oder ausgelöst werden können
  } catch(error) {
     // Anweisungsfolge, die im Ausnahmefall ausgeführt wird.
  } finally {
     // Anweisungsfolge, die anschließend in jedem Fall ausgeführt wird.
  }

Zu Beginn werden die Anweisungen im try-Block ausgeführt. Falls eine Ausnahme auftritt, wird der Kontrollfluss sofort zum catch-Block mit dem Ausnahmeobjekt als Parameter umgeleitet.

In Normalfall wird der Ausnahmeblock übersprungen. Nach der Ausführung des try-Blocks (auch teilweise) und gegebenenfalls des catch-Blocks werden in jedem Fall die Anweisungen im finally-Block ausgeführt. 

  try {
     Anweisungen
  }
  catch (err) {
     // Fehlerbehandlung
  }
  finally {
     Anweisungen
  }

Der finally-Teil kann weggelassen werden 

  try {
     Anweisungen
  }
  catch (err) {
     // Fehlerbehandlung
  }

Siehe auch

Literatur

Abgerufen von „https://de.wikipedia.org/w/index.php?title=JavaScript&oldid=2841174“