Zum Inhalt springen

„JavaScript“ – Versionsunterschied

aus Wikipedia, der freien Enzyklopädie
[ungesichtete Version][ungesichtete Version]
Inhalt gelöscht Inhalt hinzugefügt
Bota47 (Diskussion | Beiträge)
K Bot: Ändere: uk
Keine Bearbeitungszusammenfassung
Zeile 1: Zeile 1:
{{Überarbeiten}}
{{Überarbeiten}}
'''JavaScript''' ist eine [[Objektorientierte Programmierung|objektbasierte]] [[Skriptsprache]], die von der Firma [[Netscape]] entwickelt wurde, um statische [[HTML]]-Seiten dynamisch zu gestalten.
'''JavaScript''' ist eine [[Objektorientierte Programmierung|objektbasierte]] [[Skriptsprache]], die in [[HTML]]-Seiten eingebunden wird, um diese dynamisch zu gestalten und mit dem Benutzer zu interagieren.


== Überblick ==
== Überblick ==


Im Gegensatz zu [[server]]seitigen Skriptsprachen wie zum Beispiel [[Perl]] oder [[PHP]] wird JavaScript auf dem [[Client]] ausgeführt. (Netscape nutzte JavaScript mit einer im Kern identischen Syntax allerdings auch serverseitig.) Mittels einer Schnittstelle zum [[Document Object Model]] (DOM) können Elemente der [[Webseite]] manipuliert werden, nachdem diese zum Client übertragen wurden.
Im Gegensatz zu [[server]]seitigen Skriptsprachen wie zum Beispiel [[Perl]] oder [[PHP]], handelt es sich bei JavaScript um eine [[Client|clientseitige]] Skriptsprache, die vom [[Browser]] des Anwenders [[Interpreter|interpretiert]] wird.


JavaScript wurde ursprünglich von [[Netscape]] entwickelt und hat unter den [[clientseitige Skriptsprachen|clientseitigen Skriptsprachen]] inzwischen eine weite Verbreitung gefunden. Die meisten [[Website|Websites]] heutzutage verwenden JavaScript. Trotz des ähnlichen Namens hat JavaScript wenig mit der [[Programmiersprache]] [[Java (Programmiersprache)|Java]] zu tun, das von [[Sun Microsystems]] stammt (die Namensgleichheit entstand aus [[Marketing]]gründen); die [[Syntax]]en beider Sprachen ähneln jedoch einander. JavaScript setzt im Gegensatz zu Java und anderen klassisch objektorientierten Sprachen aber keine [[Klasse (objektorientierte Programmierung)|Klassen]] ein, sondern verwendet stattdessen [[Objekt]]e als [[Prototyp]]en.
Unter den [[clientseitige Skriptsprachen|clientseitigen Skriptsprachen]] hat JavaScript die weiteste Verbreitung gefunden und inzwischen findet man nicht mehr viele [[Website|Websites]], die kein JavaScript enthalten.


Die Grundlage von JavaScript wurde unter Einbeziehung von [[Microsoft]]s [[JScript]] unter dem Namen ''ECMAScript'' als [[European Computer Manufacturers Association|ECMA]]-262 standardisiert. JavaScript in der Version 1.5 entspricht ECMA-262 Edition 3. Die [[Syntax]] der Sprache ähnelt der der [[Programmiersprache]] [[Java (Programmiersprache)|Java]] und auch einige [[Schlüsselwort (Informatik)|Schlüsselwörter]] beider Sprachen sind identisch. [[Semantik|Semantisch]] jedoch unterscheiden sich beide Sprachen deutlich. Interessant ist die Tatsache, dass JavaScript im Gegensatz zu klassisch objektorientierten Sprachen keine [[Klasse (objektorientierte Programmierung)|Klassen]] einsetzt, sondern statt dessen [[Objekt (objektorientierte Programmierung)|Objekt]]e als [[Prototyp]]en verwendet.
Die Grundlage von JavaScript bildet ''ECMAScript'', das als [[European Computer Manufacturers Association|ECMA]]-262 standardisiert wurde (JavaScript in der Version 1.5 entspricht ECMA-262 Version 3). [[Microsoft]]s [[JScript]], das im [[Internet Explorer]] Verwendung findet, entspricht größtenteils JavaScript, wurde jedoch aus rechtlichen Gründen so genannt und um weitere eingene [[Feature]]s erweitert.


Über das [[Document Object Model]] ([[DOM]]) hat JavaScript Zugriff auf alle Elemente der Webseite und erlaubt es auch, diese nachdem die Seite vom Browser geladen und dargestellt wurde, beliebig zu modifizieren. Dies wird als [[Dynamic HTML]] ([[DHTML]]) bezeichnet.
JavaScript vereinheitlicht die aus anderen Sprachen bekannten Funktionen und Objekte zu einem einheitlichen Konzept. Die Sprache verfügt über integrierte [[Regulärer Ausdruck|Reguläre Ausdrücke]]. Mit [[E4X]] (ECMA-357) wird auch [[XML]] als nativer [[Datentyp]] unterstützt.

Trotz des ähnlichen Namens ist JavaScript nicht mit der Programmiersprache [[Java (Programmiersprache)|Java]] zu verwechseln. Die Namensgleichheit entstand – ähnlich wie beim [[Java Enterprise System]] – aus [[Marketing]]gründen.


== Geschichte ==
== Geschichte ==
{|
'''18. September 1995''': Mit der Vorversion des Navigator 2.0 veröffentlicht Netscape einen Browser mit einer eingebetteten Skriptsprache. Sie heißt zu diesem Zeitpunkt ''LiveScript''. [[Brendan Eich]] entwickelte die Sprache.
| width="20%" |'''18. September 1995'''||Mit der Vorversion des [[Netscape Navigator|Navigator]] 2.0 veröffentlicht [[Netscape]] einen Browser mit einer eingebetteten Skriptsprache, die zu diesem Zeitpunkt ''LiveScript'' heißt und von [[Brendan Eich]] entwickelt wurde.

|-
'''4. Dezember 1995''': [[Netscape]] und [[Sun]] benennen die Sprache ''JavaScript'', um mit dem Namen näher an Java heranzurücken.
|'''4. Dezember 1995'''||Netscape und [[Sun Microsystems]] benennen die Sprache in ''JavaScript'' um (JavaScript 1.0).
|-
'''5. März 1996''': Mit dem Enterprise Server 2.0 von Netscape erscheint der erste Server, der JavaScript-Fähigkeiten besitzt. Diese JavaScript-Variante unterscheidet sich zwangsläufig von der clientseitigen Variante.
|'''29. April 1996'''||Mit der ersten [[Beta-Version]] des [[Netscape Navigator|Navigator]] 3.0 führt Netscape JavaScript 1.1 ein.

|-
'''29. April 1996''': Mit der ersten [[Beta-Version]] des [[Netscape Navigator|Navigator]] 3.0 führt Netscape JavaScript 1.1 ein.
|'''Mai 1996'''||Microsoft stellt mit der Beta-Version des [[Internet Explorer]] 3 seinen ersten JavaScript-fähigen Browser vor. Die Skriptsprache heißt allerdings aus rechtlichen Gründen ''JScript'' und entspricht etwa dem Stand des Netscape Navigator 2. ''JScript'' schlägt einen eigenen Weg der Entwicklung ein, bleibt aber im Wesentlichen kompatibel zu JavaScript.

|-
'''Mai 1996''': Microsoft stellt mit der Beta-Version des [[Internet Explorer]]s 3 seinen ersten JavaScript-fähigen Browser vor. Die Skriptsprache heißt allerdings aus rechtlichen Gründen ''JScript'' und entspricht etwa dem Stand des Netscape Navigator 2. ''JScript'' schlägt einen eigenen Weg der Entwicklung ein, bleibt aber im Wesentlichen kompatibel zu JavaScript.
|'''15. Oktober 1996'''||Mit der Ankündigung des [[Netscape Communicator]]s wird JavaScript 1.2 veröffentlicht.

|-
'''15. November 1996''': Netscape und die ECMA bekunden, eine standardisierte Form von JavaScript entwickeln zu wollen.
|'''4. Juni 1997'''||Der Netscape Communicator 4.0 mit JavaScript 1.2 erscheint.

|-
'''15. Oktober 1996''': Mit der Ankündigung des [[Netscape Communicator]]s wird JavaScript 1.2 veröffentlicht.
|'''Juni 1997'''||Die ECMA veröffentlicht ihren Standard ECMA-262 (''ECMAScript''), der zusammen mit Netscape entwickelt wurde und die Grundelemente jeder Skriptsprache standardisieren soll.
|-
'''4. Juni 1997''': Der Netscape Communicator und damit der Navigator 4.0 mit JavaScript 1.2 erscheint.
|'''1. Oktober 1997'''||Microsoft gibt den Internet Explorer 4 heraus, der den Sprachumfang von JavaScript 1.1 abdeckt. Darüber hinaus werden eigene Erweiterungen veröffentlicht, die zu Kompatibilitätsunterschieden zwischen Navigator und Internet Explorer führen.

|-
'''Juni 1997''': Die ECMA veröffentlicht ihren Standard ECMA-262: ''ECMAScript'', der zusammen mit Netscape entwickelt wurde.
|'''23. Februar 1998'''||Der neue Browser [[Mozilla]] wird mit der Freigabe des [[Quelltext]]es des Netscape Navigators auf den Weg gebracht.

|-
'''1. Oktober 1997''': Microsoft gibt den Internet Explorer 4 heraus, der den Sprachumfang von JavaScript 1.1 abdeckt. Darüber hinaus werden eigene Erweiterungen veröffentlicht, die zu Kompatibilitätsproblemen zwischen Navigator und Internet Explorer führen.
|'''April 1998'''||ECMAScript ist nun ISO-Norm: "ISO/IEC 16262:1998 Information technology - ECMAScript language specification".

|-
'''23. Februar 1998''': Der neue Browser [[Mozilla]] wird mit der Freigabe des Quelltexts des Netscape Navigators auf den Weg gebracht.
|'''Juli 1998'''||Eine Beta-Version des Netscape Communicators 4.5 wird veröffentlicht. JavaScript trägt nun die Version 1.3. Erstmals zu finden war diese JavaScript-Version schon in der Version 4.06 des Netscape Communicators.

|-
'''April 1998''': ECMAScript ist nun ISO-Norm: ISO/IEC 16262:1998 Information technology - ECMAScript language specification.
|'''Oktober 1998'''||Netscape stellt JavaScript 1.4 vor. Diese Version ist vollständig kompatibel mit ECMA-262. Ein Browser mit der Unterstützung dieser Version erscheint jedoch nicht.

|-
'''Juli 1998''': Eine Beta-Version des Netscape Communicators 4.5 wird veröffentlicht. JavaScript trägt nun die Version 1.3. Erstmals zu finden war diese JavaScript-Version schon in der Version 4.06 des Netscape Communicators.
|'''April 2000'''||Netscape gibt die Preview Release 1 des Navigator 6 heraus, welcher auf dem sich in der Entwicklung befindlichen Browser Mozilla in der Version 0.6 beruht. Diese Version implementiert erstmals JavaScript 1.5.

|-
'''Oktober 1998''': Netscape stellt JavaScript 1.4 vor. Diese Version ist vollständig kompatibel mit ECMA-262. Ein Browser mit der Unterstützung dieser Version erscheint jedoch nicht.
|'''5. Juni 2002'''||Mozilla 1.0 erscheint mit JavaScript 1.5.
|-
'''April 2000''': Netscape gibt die Preview Release 1 des Navigator 6 heraus, welcher auf dem in der Entwicklung befindlichen Browser Mozilla in der Version 0.6 beruht. Diese Version implementiert erstmals JavaScript 1.5.
|'''29. November 2005'''||Mozilla Firefox 1.5 erscheint mit JavaScript 1.6.

|}
'''5. Juni 2002''': Mozilla 1.0 erscheint mit JavaScript 1.5.

'''29. November 2005''': Mozilla Firefox 1.5 erscheint mit JavaScript 1.6.


==Einsatzgebiete von JavaScript==
==Einsatzgebiete von JavaScript==

Version vom 10. März 2006, 20:59 Uhr

JavaScript ist eine objektbasierte Skriptsprache, die in HTML-Seiten eingebunden wird, um diese dynamisch zu gestalten und mit dem Benutzer zu interagieren.

Überblick

Im Gegensatz zu serverseitigen Skriptsprachen wie zum Beispiel Perl oder PHP, handelt es sich bei JavaScript um eine clientseitige Skriptsprache, die vom Browser des Anwenders interpretiert wird.

JavaScript wurde ursprünglich von Netscape entwickelt und hat unter den clientseitigen Skriptsprachen inzwischen eine weite Verbreitung gefunden. Die meisten Websites heutzutage verwenden JavaScript. Trotz des ähnlichen Namens hat JavaScript wenig mit der Programmiersprache Java zu tun, das von Sun Microsystems stammt (die Namensgleichheit entstand aus Marketinggründen); die Syntaxen beider Sprachen ähneln jedoch einander. JavaScript setzt im Gegensatz zu Java und anderen klassisch objektorientierten Sprachen aber keine Klassen ein, sondern verwendet stattdessen Objekte als Prototypen.

Die Grundlage von JavaScript bildet ECMAScript, das als ECMA-262 standardisiert wurde (JavaScript in der Version 1.5 entspricht ECMA-262 Version 3). Microsofts JScript, das im Internet Explorer Verwendung findet, entspricht größtenteils JavaScript, wurde jedoch aus rechtlichen Gründen so genannt und um weitere eingene Features erweitert.

Über das Document Object Model (DOM) hat JavaScript Zugriff auf alle Elemente der Webseite und erlaubt es auch, diese nachdem die Seite vom Browser geladen und dargestellt wurde, beliebig zu modifizieren. Dies wird als Dynamic HTML (DHTML) bezeichnet.

Geschichte

18. September 1995 Mit der Vorversion des Navigator 2.0 veröffentlicht Netscape einen Browser mit einer eingebetteten Skriptsprache, die zu diesem Zeitpunkt LiveScript heißt und von Brendan Eich entwickelt wurde.
4. Dezember 1995 Netscape und Sun Microsystems benennen die Sprache in JavaScript um (JavaScript 1.0).
29. April 1996 Mit der ersten Beta-Version des Navigator 3.0 führt Netscape JavaScript 1.1 ein.
Mai 1996 Microsoft stellt mit der Beta-Version des Internet Explorer 3 seinen ersten JavaScript-fähigen Browser vor. Die Skriptsprache heißt allerdings aus rechtlichen Gründen JScript und entspricht etwa dem Stand des Netscape Navigator 2. JScript schlägt einen eigenen Weg der Entwicklung ein, bleibt aber im Wesentlichen kompatibel zu JavaScript.
15. Oktober 1996 Mit der Ankündigung des Netscape Communicators wird JavaScript 1.2 veröffentlicht.
4. Juni 1997 Der Netscape Communicator 4.0 mit JavaScript 1.2 erscheint.
Juni 1997 Die ECMA veröffentlicht ihren Standard ECMA-262 (ECMAScript), der zusammen mit Netscape entwickelt wurde und die Grundelemente jeder Skriptsprache standardisieren soll.
1. Oktober 1997 Microsoft gibt den Internet Explorer 4 heraus, der den Sprachumfang von JavaScript 1.1 abdeckt. Darüber hinaus werden eigene Erweiterungen veröffentlicht, die zu Kompatibilitätsunterschieden zwischen Navigator und Internet Explorer führen.
23. Februar 1998 Der neue Browser Mozilla wird mit der Freigabe des Quelltextes des Netscape Navigators auf den Weg gebracht.
April 1998 ECMAScript ist nun ISO-Norm: "ISO/IEC 16262:1998 Information technology - ECMAScript language specification".
Juli 1998 Eine Beta-Version des Netscape Communicators 4.5 wird veröffentlicht. JavaScript trägt nun die Version 1.3. Erstmals zu finden war diese JavaScript-Version schon in der Version 4.06 des Netscape Communicators.
Oktober 1998 Netscape stellt JavaScript 1.4 vor. Diese Version ist vollständig kompatibel mit ECMA-262. Ein Browser mit der Unterstützung dieser Version erscheint jedoch nicht.
April 2000 Netscape gibt die Preview Release 1 des Navigator 6 heraus, welcher auf dem sich in der Entwicklung befindlichen Browser Mozilla in der Version 0.6 beruht. Diese Version implementiert erstmals JavaScript 1.5.
5. Juni 2002 Mozilla 1.0 erscheint mit JavaScript 1.5.
29. November 2005 Mozilla Firefox 1.5 erscheint mit JavaScript 1.6.

Einsatzgebiete von JavaScript

Typische Anwendungsgebiete von JavaScript sind:

  • Popup-Fenster und Layer-Werbung
  • Ausgabe von Laufschriften oder anderen Animationen.
  • Mouseover/Rollover (Hervorheben von Schaltflächen und Bildern beim Berühren mit dem Maus-Cursor)
  • Laden/Senden von Daten ohne dass der Browser die Seite aktualisieren muss. Diese Technik wird Ajax genannt.
  • Reparieren fehlerhafter CSS-Implementierungen mancher Browser
  • Usability-Verbesserungen wie ausklappbare Menüs, Gültigkeitsprüfung und Autotext bei Formularen, Widgets, etc.

Datenstrukturen und Objekte

Vordefinierte Objekte

JavaScript kennt mehrere eingebaute Objekte, die von ECMAScript definiert werden.

Die restlichen Objekte, die beim clientseitigen JavaScript verwendet werden, entstanden historisch vor allem durch die Netscape-Spezifikationen (window, document usw.). Zahlreiche Unterobjekte von document wurden mittlerweile durch DOM HTML standardisiert (title, images, links, forms usw.). Aktuelle Browser unterstützen zudem DOM Core und andere W3C-DOM-Standards sowie Erweiterungen von Microsoft JScript.

Datentypen

Die vordefinierten Prototypen korrespondieren teilweise mit grundlegenden Datentypen. Zeichenketten haben den Typ String, numerische Werte den Typ Number und boolsche Werte den Typ Boolean. Des Weiteren gibt es die Typen Null und Undefined. Dies sind sogenannte einfache Werte (primitive values). Alle anderen Werte sind Objekte (objects) und haben den Typ Object. Funktionen, Arrays, Datumsobjekte und reguläre Ausdrücke sind so gesehen spezielle Objekte.

Beim direkten Notieren von Zeichenketten, Zahlen oder booleschen Variablen entstehen einfache Werte (z.B. bei var variable = "Beispieltext";). Beim Nutzen der jeweiligen Konstruktorfunktionen hingegen entstehen Objekte (z.B. bei var variable = new String("Beispieltext");).

Zugriff auf Objekteigenschaften und -methoden

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

objekt.eigenschaft

bzw.

objekt.methode()

Allen Objekten können zur Laufzeit neue Eigenschaften hinzugefügt. In diesem Beispiel wird eigenschaftA mit 1 belegt:

objekt.eigenschaftA = 1;

Eigenschaften können äquivalent über die folgende Notation angesprochen werden, bei der der Eigenschaftsname als Zeichenkette notiert wird:

objekt["eigenschaftA"] = 1;

Durch diese Schreibweise ist es möglich, alle Eigenschaften eines Objektes mit einer For ... in-Schleife zu durchlaufen. In diesem Beispiel wird „objekt.eigenschaftA = 1“ ausgegeben.

for (var eigenschaftsname in objekt) {
    window.alert("objekt." + eigenschaftsname + " = " + objekt[eigenschaftsname]);
}

Zum Entfernen von Eigenschaften wird der delete-Operator verwendet:

delete objekt.eigenschaftA;

Die wichtigsten Eigenschaften und Methoden der Prototypen

Object

beispielobjekt = new Object(); Neues Objekt erstellen
beispielobjekt = {}; Neues Objekt erstellen (Alternative)

Array

beispielarray = new Array(1,2,3,4) Neues Array anlegen
beispielarray = [1,2,3,4] Neues Array anlegen (Alternative)
beispielarray.length Anzahl der Elemente zurückgeben
beispielarray.concat(anderesArray) Zwei Arrays verbinden
beispielarray.join(Trennzeichen) Array in Zeichenkette umwandeln
beispielarray.pop() Letztes Element aus Array löschen
beispielarray.push(neuerWert) Ein neues Element an das Ende des Array anhängen
beispielarray.reverse() Reihenfolge der Elemente umkehren

String

Ein String kann in der Kurzschreibweise "Zeichenkette" oder 'Zeichenkette' notiert werden. Alternativ kann der String-Konstruktor verwendet werden: new String(10) gibt etwa die Zahl 10 als String wieder.

beispielstring = "Hallo" Neuen String anlegen
beispielstring = new String("Hallo") Neuen String anlegen (Alternative)
beispielstring.length Gibt die Länge des Strings wieder
beispielstring.toLowerCase() Gibt den String komplett kleingeschrieben wieder
beispielstring.toUpperCase() Gibt den String komplett großgeschrieben wieder
beispielstring.split(Trennzeichen) Wandelt den String durch ein Trennzeichens in einen Array mit Teilstrings um
string.indexOf(andererString) Gibt die Position des ersten Vorkommens des angegebenen Strings wieder. Wird dieser nicht darin gefunden, so gibt die Methode -1 zurück

Während die Kurzschreibweise "Hallo" ein einfacher Wert des Typs String angelegt wird, entsteht bei new String("Hallo") ein Objekt des Typs Object. Dies ist in den meisten Fällen unwesentlich. Im Falle der objektunabhängigen Funktion eval(), die einen String-Wert entgegennimmt und diesen als JavaScript-Ausdruck interpretiert, zeigt sich jedoch der feine Unterschied:

eval("25+25") ergibt 50 (Typ Number)
eval(new String("25+25")) ergibt "25+25" (Typ String)

Date

beispielzeitpunkt = new Date() Ein neues Date-Objekt erzeugen

Math

Math.max(Zahl1, Zahl2) Gibt die größere der beiden angegebenen Zahlen zurück
Math.min(Zahl1, Zahl2) Gibt die kleinere der beiden angegebenen Zahlen zurück
Math.pow(Basis, Exponent) Gibt das Ergebnis der Exponentialrechnung zurück
Math.random() Gibt eine Zufallszahl, die größer oder gleich 0 und kleiner als 1 ist, zurück
Math.round(Zahl) Rundet die angegebene Zahl
Math.abs(Zahl) Gibt die absolute Zahl, d. h. den Betrag der angegebenen Zahl zurück

Kontrollstrukturen

If ... else (Bedingte Anweisung)

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

If ... else if ... else

In JavaScript gibt es im Gegensatz zu anderen Programmiersprachen keine Kontrollstruktur if ... elseif .... An dessen Stelle kann man zwei if-Anweisungen verwenden, von denen die erste die zweite in ihrem else-Teil enthält:

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

Es können jedoch beliebig viele else if-Blöcken verwendet werden:

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

Switch-Kontrollstruktur

switch (Ausdruck) {
    case marke1 :
        Anweisungen;
        break;
    case marke2 :
        Anweisungen;
        break;
    default :
        Anweisungen;
}
while (Bedingung) {
    Anweisungen;
}
do {
    Anweisungen;
} while (Bedingung);
for ([Startausdruck]; [Bedingung]; [Inkrementier-Ausdruck]) {
    Anweisungen;
}

For ... in-Schleife

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

for (eigenschaftsname in objekt) {
    Anweisungen;
}

Funktionen

Eine Funktion ist ein Block mit Anweisungen, dem ein Name zugewiesen wird. Eine Funktion hat eine Liste von Parametern, die auch leer sein kann, und kann einen Resultatwert zurückgeben.

function meineFunktion (Parameter1, Parameter2, Parameter3) {
    Anweisungen;
    return Ausdruck;
}

Funktionen können auch ineinander verschachtelt werden. Die inneren Funktionen sind dabei nur innerhalb der äußeren verfügbar.

Neben der obigen gängigen Notation kann alternativ eine sogenannte Function Expression verwendet werden:

var Addieren = function (zahl1, zahl2) {
    return zahl1 + zahl2;
};

Da alle Funktionen vom Prototyp-Objekt Function abgeleitet sind, kann eine Funktion zudem mithilfe des Function-Konstruktors notiert werden. Das Besondere an dieser Schreibweise ist, dass sowohl Parameternamen als auch der Code des Funktionskörpers als Strings notiert werden.

var Addieren = new Function("zahl1", "zahl2", "return zahl1 + zahl2;");

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 {
            a = 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.

Da Funktionen in JavaScript vollwertige Objekte sind, sind sie Funktionen höherer Ordnung und können auch als Parameter an andere Funktionen übergeben werden.

Beispiel für Verwendung einer Funktion höherer Ordnung:

Array.prototype.fold = function (functor) {
    var result = 0;
    for (var i = 0; i < this.length; i++) {
        result = functor(result, this[i]);
    }
    return result;
}
var array = new Array(21,33,17,12);
var addition = function (a, b) { return a + b; };
var sum = array.fold(addition);

Ebenso ist es möglich curried functions zu schreiben:

function add (a, b) {
    if (arguments.length < 1)
        return add;
    if (arguments.length < 2) {
        return function (c) { return a + c; };
    } else {
        return a + b;
    }
}

Eigene Objekte definieren

Konstruktor-Funktionen

Eine JavaScript-Funktion kann dazu genutzt werden, um ein mit new erstelltes Objekt zu initialisieren. In diesem Fall spricht man von einem Konstruktor oder einer Konstruktor-Funktion. Innerhalb dieser Funktion kann das neue Objekt über die this-Variable angesprochen werden. Darüber können dem Objekt Eigenschaften angehängt werden.

function meinObjekt () {
    this.zahl = 1;
}

Neue Instanz erstellen:

var objekt = new meinObjekt();

Zugriff auf die Eigenschaft zahl, es wird „1“ ausgegeben:

window.alert(objekt.zahl);

Im Beispiel wurde dem Objekt eine Eigenschaft vom Typ Number, d.h. eine Zahl angehängt. Erlaubt sind Eigenschaften jedes möglichen Typs, darunter auch Funktionen. Objektmethoden sind somit nur spezielle Eigenschaften vom Typ function.

Öffentliche und private Methoden und Eigenschaften

Beim Definieren eigener Prototypen können Eigenschaften und Methoden entweder als öffentlich oder als privat notiert werden. Diese Unterscheidung bezieht sich auf ihre Verfügbarkeit, das heißt aus welchem Kontext der Zugriff erlaubt ist. Private Eigenschaften können nur aus der Konstruktor-Funktion und aus objekteigenen Methoden heraus gelesen und geschrieben werden. Der Zugriff von außerhalb des Objekts ist nur bei öffentlichen Eigenschaften möglich. Dementsprechend können öffentliche Methoden – die letztlich nur besondere Eigenschaften sind – aus jedem Kontext heraus, in dem das Objekt verfügbar ist, ausgeführt werden. Private Methoden sind analog nur objektintern aufrufbar.

Methoden werden zudem anhand ihrer Zugriffsrechte auf objekteigene Eigenschaften und Methoden unterschieden. Private Methoden haben prinzipiell Zugriff auf alle öffentlichen und privaten Eigenschaften und Methoden. Dasselbe gilt für sogenannte privilegierte öffentliche Methoden. Nicht-privilegierte öffentliche Methoden können nur auf öffentliche Eigenschaften und Methoden zugreifen. Erstgenannte werden innerhalb der Konstruktor-Funktion definiert, letztgenannte werden von außen über die prototype-Eigenschaft der Konstruktor-Funktion hinzugefügt (siehe den folgenden Abschnitt).

Im folgenden Beispiel werden die verschiedenen Eigenschafts- und Methodentypen demonstriert.

function meinObjekt (parameter) {
    /* parameter ist eine private Eigenschaft */

    /* Speichere eine Referenz auf das aktuelle Objekt in 
       der privaten Eigenschaft self */
    var self = this;

    /* private Eigenschaft */
    var private_eigenschaft = "privat";

    /* öffentliche Eigenschaft */
    this.oeffentliche_eigenschaft = "öffentlich";

    /* private Methode */ 
    var private_methode = function () {
        window.alert(private_eigenschaft + " " + self.oeffentliche_eigenschaft);
    };

    /* privilegierte öffentliche Methode */ 
    this.privilegierte_methode = function () {
        window.alert(private_eigenschaft + " " + this.oeffentliche_eigenschaft);
        private_methode();
    };
}

/* nicht-privilegierte öffentliche Methode */ 
meinObjekt.prototype.oeffentliche_methode = function () {
    window.alert(typeof(private_eigenschaft) + " " + typeof(private_methode));
    window.alert(this.oeffentliche_eigenschaft);
};

Neue Instanz erstellen:

var objekt = new meinObjekt();

Auf private_eigenschaft und private_methode kann von außen nicht zugegriffen werden. Daher wird zweimal „undefined“ ausgegeben:

window.alert(objekt.private_eigenschaft + " " + objekt.private_methode);

Der Zugriff auf oeffentliche_eigenschaft hingegen ist von außen möglich. Es wird „öffentlich“ ausgegeben:

window.alert(objekt.oeffentliche_eigenschaft);

Ebenso können privilegierte_methode und oeffentliche_methode von außen aufgerufen werden:

objekt.privilegierte_methode();
objekt.oeffentliche_methode();

Diese Methoden demonstrieren die unterschiedlichen Zugriffsrechte.

privilegierte_methode gibt die Eigenschaften private_eigenschaft und oeffentliche_eigenschaft aus. Im Meldungsfenster wird „privat öffentlich“ ausgegeben. Danach ruft sie private_methode() auf, die noch einmal dasselbe demonstriert.

oeffentliche_methode hingegen hat keinen Zugriff auf private_eigenschaft und private_methode. Das Meldungsfenster zeigt zweimal „undefined“. Lediglich der Zugriff auf oeffentliche_eigenschaft gelingt.

Aufgrund eines Fehlers in der ECMAScript-Spezifikation ist das Ansprechen von öffentlichen Eigenschaften und Methoden in privaten Methoden schwierig, weil this nicht wie in öffentlichen Methoden auf das aktuelle Objekt verweist. Daher bedient man sich eines Tricks, indem man im Konstruktor this in einer privaten Eigenschaft speichert, gängigerweise self. Darüber gelingt der Zugriff auf öffentliche Eigenschaften und Methoden in privaten Methoden.

Vererbung (prototype-Eigenschaft)

Jede Funktion, d.h. jedes vom Function-Prototyp abgeleitete Objekt verfügt über eine prototype-Eigenschaft. Diese übernimmt eine wichtige Aufgabe, wenn die Funktion als Konstruktor benutzt wird, um neue Objekte zu initialisieren. Die prototype-Eigenschaft definiert in diesem Falle gemeinsame Eigenschaften aller Objekte, die mit dem Konstruktor erstellt werden. Man spricht von Prototyp-basierter Vererbung. Auf diese Weise ermöglicht JavaScript mehrstufige Vererbung:

Konstruktor eines Prototyps erstellen:

function Kraftfahrzeug (Fabrikat) {
   this.Fabrikat = Fabrikat;
   this.Beispieleigenschaft = "Beispielwert";
}

Konstruktor des abgeleiteten Prototyps erstellen:

function PKW (Fabrikat) {
   this.constructor(Fabrikat);
   this.weitereEigenschaft = "Beispielwert";
}
PKW.prototype = new Kraftfahrzeug();

Eine neue Instanz des allgemeinen Prototyps Kraftfahrzeug dient als Muster des abgeleiteten Prototyps PKW. Dadurch werden die Eigenschaften des allgemeinen Prototyps an den abgeleiteten Prototyp vererbt: Jedes PKW-Objekt ist gleichzeitig ein Kraftfahrzeug-Objekt. Über this.constructor kann im PKW-Konstruktor der Kraftfahrzeug-Konstruktor angesprochen werden. Dies wird im Beispiel dazu genutzt, die Parameter an letztgenannten weiterzugeben. So muss this.Fabrikat = Fabrikat; nur im Kraftfahrzeug-Konstruktor notiert sein.

Instanz des Prototyps PKW erstellen:

var Golf = new PKW("Volkswagen Golf");
var Ente = new PKW("Citroen 2CV");

Über die prototype-Eigenschaft der Konstruktorfunktion können einem Prototyp auch nachträglich Eigenschaften und Methoden hinzugefügt werden. Diese Änderungen wirken sich auf alle davon abgeleiteten Objekte aus:

PKW.prototype.Radanzahl = 4;
PKW.prototype.zeigeRadanzahl = function () {
   window.alert(this.Fabrikat + " hat " + this.Radanzahl + " Räder.");
};
Golf.zeigeRadanzahl(); // Ausgabe: „Volkswagen Golf hat 4 Räder.“
Ente.zeigeRadanzahl(); // Ausgabe: „Citroen 2CV hat 4 Räder.“

Eine nützliche Methode des Object-Prototyps ist hasOwnProperty(Eigenschaftsname). Sie gibt einen booleschen Wert, also true oder false zurück. Dadurch lässt sich ermitteln, ob eine bestimmte Eigenschaft durch dessen Konstruktor selbst oder durch seine Prototyp-Kette definiert wird. Im Beispiel ergibt Golf.hasOwnProperty("Radanzahl") false, ebenso wie Golf.hasOwnProperty("zeigeRadanzahl"). Beide Eigenschaften wurden nachträglich über PKW.prototype hinzugefügt. Golf.hasOwnProperty("Fabrikat") und Golf.hasOwnProperty("weitereEigenschaft") hingegen ergeben true, weil diese Eigenschaften durch die Konstruktoren Kraftfahrzeug und PKW belegt wurden.

Benutzerinteraktion

Meist erfolgt die Benutzerinteraktion über die Änderung der Inhalte eines HTML-Dokuments, insbesondere der Formulare, auf dessen Elemente über das DOM zugegriffen wird. 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");

Bestätigungsdialog

Zeigt einen Dialog mit den Schaltflächen „OK“ und „Abbrechen“ an. Zurückgegeben wird ein boolescher Wert, je nachdem welche Schaltfläche der Benutzer ausgewählt hat.

var bestaetigt = window.confirm("Bitte bestätigen");

Eingabeaufforderung

Es wird ein Dialog zur Informationseingabe angezeigt. Beispiel:

var eingabe = window.prompt("Bitte geben Sie einen Text ein:", "");

Statusleiste

Gibt den Text in der Statusleiste des Browserfensters aus:

window.status = "Hallo Welt";

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 Anweisung try ... catch zur Fehlerbehandlung.

Die Anweisung try ... catch ... finally 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.
    // In diesem Teil kann die Fehlerbehandlung erfolgen.
} finally {
    // Anweisungsfolge, die anschließend in jedem Fall ausgeführt wird.
}
...
throw("sample exception")

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.

Im 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. Der finally-Teil kann weggelassen werden, alternativ der catch-Teil.

Literatur

  • Tobias Hauser: JavaScript Kompendium – Interaktives und dynamisches Webpublishing. Markt und Technik, München 2003, ISBN 3-8272-6465-0
  • David Flanagan: JavaScript – das umfassende Referenzwerk. 2. Auflage, O'Reilly, Köln 2002, ISBN 3-89721-330-3
  • Danny Goodman: JavaScript, eine Sprache für alles. mitp-Verlag, Bonn 2003, ISBN 3-8266-0914-X
  • Ralph Steyer: JavaScript in 21 Tagen – Scripte einbinden und programmieren., Markt und Technik, München 2000, ISBN 3-8272-6508-8
  • Ralph Steyer: Jetzt lerne ich JavaScript und HTML. Markt und Technik, München 2001, ISBN 3-8272-5996-7
  • Ralph Steyer: Das JavaScript Codebook. Addison-Wesley, München 2004, ISBN 3-8273-2162-X
  • Michael Seeboerger-Weichselbaum: Das Einsteigerseminar JavaScript bhv,3 Ausgabe, Bonn 2004,ISBN 3-8266-7286-0
  • Stefan Münz, Wolfgang Nefzger: JavaScript Referenz. Franzis, Poing 2003, ISBN 3-7723-6520-5
  • Jan Winkler: JavaScript, Franzis, Poing 2003, ISBN 3-7723-6007-6
  • Stefan Mintert, Christine Kühnel (Hrsg.): Workshop JavaScript, 2. Auflage, Addison-Wesley, München 2000, ISBN 3-8273-1718-5, Online-Fassung des Buches
  • Stefan Koch: JavaScript – Einführung, Programmierung, Referenz, 3. Auflage, dpunkt.verlag, Heidelberg 2001, ISBN 3-89864-111-2
  • Heather Williamson: Dynamic HTML browserübergreifend – HTML, CSS, DOM, JavaScript und JScript, Galileo Press, Bonn 2001, ISBN 3-934358-29-2
  • Mark Lubkowitz: Webseiten programmieren und gestalten – HTML, CSS, JavaScript, PHP, Perl, MySQL, SVG, 2. Auflage, Galileo Press, Bonn 2005, ISBN 3-89842-557-6
  • Christian Wenz: JavaScript – Das umfassende Handbuch, 6. Auflage, Galileo Press, Bonn 2005, ISBN 3-89842-617-3
  • Christian Wenz: JavaScript-Rezepte, Galileo Press, Bonn 2002, ISBN 3-89842-149-X

Siehe auch

DHTML, Ajax, Bookmarklet, LiveConnect, ActionScript, CorbaScript, Lingo, Rhino

Spezifikationen

Dokumentationen