JavaScript

aus Wikipedia, der freien Enzyklopädie
(Weitergeleitet von ECMAScript)
Wechseln zu: Navigation, Suche
JavaScript
Paradigmen: multiparadigmatisch
Erscheinungsjahr: 1995
Entwickler: Brendan Eich
Aktuelle Version: 1.8.5  (2010)
Typisierung: schwach, dynamisch, duck
Wichtige Implementierungen: SpiderMonkey, Rhino, SquirrelFish, V8
Beeinflusst von: Self, C, Scheme, Perl, Python, Java
Beeinflusste: ActionScript, Haxe, CoffeeScript, Dart, TypeScript

JavaScript (kurz JS) ist eine Skriptsprache, die ursprünglich für dynamisches HTML in Webbrowsern entwickelt wurde, um Benutzerinteraktionen auszuwerten, Inhalte zu verändern, nachzuladen oder zu generieren und so die Möglichkeiten von HTML und CSS zu erweitern. Heute findet JavaScript auch außerhalb von Browsern Anwendung, so etwa auf Servern und in Microcontrollern.[1][2]

Der als ECMAScript (ECMA 262) standardisierte Sprachkern von JavaScript beschreibt eine dynamisch typisierte, objektorientierte, aber klassenlose Skriptsprache. Sie wird allen objektorientierten Programmierparadigmen unter anderem auf der Basis von Prototypen gerecht. In JavaScript lässt sich objektorientiert und sowohl prozedural als auch funktional programmieren.

Entwicklung[Bearbeiten]

Die Syntax von JavaScript ähnelt jener der C-Abkömmlinge, wozu auch Java gehört. Trotz der Namens- und syntaktischen Ähnlichkeit hat JavaScript nur geringe Gemeinsamkeiten mit Java, beispielsweise wird Vererbung in JavaScript anders als in Java nicht durch Klassen, sondern durch Prototypen unterstützt.

JavaScript wurde früher hauptsächlich clientseitig eingesetzt. JavaScript bzw. die ECMAScript-Implementierungen finden jedoch beispielsweise auf Node-Servern und als JScript bzw. JScript.NET in einer ASP- bzw. ASP.NET-Umgebung auf Microsoft Internet Information Services auch serverseitig Anwendung. Weitere Beispiele für serverseitige Javascript-Programmierung sind POW und Jaxer, die auf der Mozilla-Javascript-Engine Spidermonkey aufsetzen, sowie V8CGI, welches auf der JavaScript-Implementierung V8 aufbaut und in den Apache HTTP Server integriert wird.

Die Sprache wird auch als Skriptsprache für Spiele und Anwendungsprogramme eingesetzt, da der Sprachkern nur wenige Objekte enthält und dadurch der zur Ausführung von in JavaScript formulierten Skripten erforderliche Interpreter relativ klein gehalten werden kann.

Außerdem wird JavaScript als Verkehrssprache in der Datenbank mongoDB sowie in Microcontrollern[1][2] eingesetzt.

Verwendung[Bearbeiten]

Typische Anwendungsgebiete[Bearbeiten]

Typische Anwendungsgebiete von JavaScript sind:

  • dynamische Manipulation von Webseiten über das Document Object Model
  • Plausibilitätsprüfung (Datenvalidierung) von Formulareingaben noch vor der Übertragung zum Server
  • Anzeige von Dialogfenstern
  • Senden und Empfangen von Daten, ohne dass der Browser die Seite neu laden muss (Ajax)
  • Vorschlagen von Suchbegriffen während der Eingabe
  • Werbebanner oder Laufschriften
  • Verschleierung von E-Mail-Adressen zur Bekämpfung von Spam
  • mehrere Frames auf einmal wechseln oder die Seite aus dem Frameset lösen
  • Schreib- und Lesezugriff auf Cookies und den Web Storage innerhalb des Browsers

Missbrauch[Bearbeiten]

Einige Anwendungen, die mit JavaScript möglich sind, agieren teilweise gegen den Wunsch des Benutzers oder widersprechen dem Prinzip der geringsten Verwunderung. Einige Browser bieten daher Funktionen an, die derartige JavaScript-Funktionen unterdrücken.

Beispiele:

Hinweis im Firefox-Browser bei vielen Dialogfenstern
  • Verschleiern von Internetadressen, auf die ein Link verweist
  • Deaktivieren des Kontextmenüs, um zu erschweren, dass Bilder oder die gesamte Seite abgespeichert werden können
  • Deaktivieren der Kopierfunktion, um zu erschweren, dass Texte oder Bilder kopiert werden können
  • Unaufgeforderte (Werbe-)Pop-ups oder Pop-unders oder aufeinanderfolgende Dialogfenster, die den Benutzer behindern
  • Ungewolltes Schließen des Browserfensters
  • Ungewollte Größenänderung des Browserfensters
  • Barrierearme Webseiten zeichnen sich dadurch aus, dass sie auch bei abgeschaltetem JavaScript möglichst uneingeschränkt nutzbar bleiben. Teilweise schränkt das deaktivierte JavaScript die Benutzbarkeit einer Webseite ein.
  • Maßnahmen, die an den Sicherheitseinstellungen des Browsers vorbei ein Wiedererkennen eines Benutzers bei einem späteren Besuch einer Website erlauben (siehe Anonymität im Internet)
  • Bei anfälligen Webanwendungen kann JavaScript auch von Dritten missbraucht werden, etwa per XSS (Codeeinschleusung).

Geschichte[Bearbeiten]

Am 18. September 1995 veröffentlichte Netscape mit der Vorversion des Navigator 2.0 einen Browser mit einer eingebetteten Skriptsprache, die zu diesem Zeitpunkt LiveScript hieß und von Brendan Eich entwickelt worden war. Die Sprache konnte u. a. Formulareingaben des Benutzers vor dem Absenden überprüfen. Am 4. Dezember 1995 verkündeten Netscape und Sun Microsystems eine Kooperation, die die Interaktion von LiveScript direkt mit Java-Applets zum Ziel hatte. Sun entwickelte die nötigen Java-Klassen, Netscape die Schnittstelle LiveConnect und benannte die Sprache in JavaScript um (JavaScript 1.0).[3] JavaScript ist seit der Übernahme von Sun Microsystems eine Marke des Unternehmens Oracle.[4]

Mit der ersten Beta-Version des Navigator 3.0 führte Netscape am 29. April 1996 JavaScript 1.1 ein. In selbiger Version gab es die Neuerungen, auf Bilder zugreifen und so genannte Rollover-Grafiken erstellen zu können. LiveConnect war jetzt fester Bestandteil des Browsers. Mit der Beta-Version des Internet Explorer 3 stellte Microsoft im Mai 1996 seinen ersten JScript-fähigen Browser vor. Dies war der Beginn des Browserkriegs.

Mit der Ankündigung des Netscape Communicators wurde JavaScript 1.2 am 15. Oktober 1996 veröffentlicht, der Netscape Communicator 4.0 mit JavaScript 1.2 erschien jedoch erst am 4. Juni 1997. Ebenfalls im Juni 1997 veröffentlichte die European Computer Manufacturers Association ihren Standard ECMA-262 (ECMAScript), der zusammen mit Netscape entwickelt worden war und die Grundelemente einer Skriptsprache standardisieren sollte. Diese wurde im April 1998 zur ISO-Norm ISO/IEC 16262:1998 Information technology – ECMAScript language specification. Am 1. Oktober 1997 kam der Internet Explorer 4 heraus, der den Sprachumfang von JavaScript 1.1 abdeckte. Darüber hinaus wurden eigene Erweiterungen veröffentlicht, die zu Kompatibilitätsunterschieden zwischen Navigator und Internet Explorer führten und eine DOM-ähnliche Syntax zur Verfügung stellten, die es ermöglichte, auf alle Elemente der Webseite zugreifen und diese beliebig verändern zu können.

Der in Java implementierte JavaScript-Interpreter Rhino wurde ab Version 6.0 als Teil der Java-Laufzeitumgebung standardmäßig mitgeliefert.[5] Im Juli 1998 wurde mit der Beta-Version des Netscape Communicators 4.5 JavaScript 1.3, welche schon in der Version 4.06 des Netscape Communicators vorhanden war, veröffentlicht. Im Oktober 1998 stellte Netscape JavaScript 1.4 vor. Diese Version war vollständig kompatibel mit ECMA-262. Ein Browser mit der Unterstützung dieser Version erschien jedoch nicht. Im April 2000 kam mit der Preview Release 1 des Navigator 6 JavaScript 1.5 und DOM Level 1. Am 5. Juni 2002 erschien Mozilla 1.0 mit JavaScript 1.5 (JavaScript in der Version 1.5 entspricht ECMA-262 Version 3), am 29. November 2005 Mozilla Firefox 1.5 mit JavaScript 1.6, am 12. Juli 2006 Mozilla Firefox 2.0b1 mit JavaScript 1.7 und am 18. Dezember 2007 Mozilla Firefox 3.0b2 mit JavaScript 1.8.

Versionsgeschichte von JavaScript[Bearbeiten]

Versionsgeschichte nach John Resig[6]
Version Veröffentlichung Entsprechung Netscape Navigator Mozilla Firefox Internet Explorer Opera Safari Google Chrome
Ältere Version; nicht mehr unterstützt: 1.0.0 März 1996 2.0 3.0
Ältere Version; nicht mehr unterstützt: 1.1.0 August 1996 3.0
Ältere Version; nicht mehr unterstützt: 1.2.0 Juni 1997 4.0-4.05
Ältere Version; nicht mehr unterstützt: 1.3.0 Oktober 1998 ECMA-262 1st edition / ECMA-262 2nd edition 4.06-4.7x 4.0
Ältere Version; nicht mehr unterstützt: 1.4.0 Netscape Server
Ältere Version; nicht mehr unterstützt: 1.5.0 November 2000 ECMA-262 3rd edition 6.0 1.0
  • 5.5 (JScript 5.5)
  • 6 (JScript 5.6)
  • 7 (JScript 5.7)
  • 8 (JScript 6)
  • 6.0
  • 7.0
  • 8.0
  • 9.0
Ältere Version; nicht mehr unterstützt: 1.6.0 November 2005 1.5 + Array extras + Array & String generics + E4X 1.5
  • 3.0
  • 3.1
Ältere Version; nicht mehr unterstützt: 1.7.0 Oktober 2006 1.6 + Pythonic generators + Iterators + let + destructuring assignments 2.0
  • 3.2
  • 4.0
1.0
Ältere Version; nicht mehr unterstützt: 1.8.0 Juni 2008 1.7 + Generator expressions + Expression closures 3.0
Ältere Version; nicht mehr unterstützt: 1.8.1 1.8 + geringfügige Updates 3.5
Aktuelle Version: 1.8.5 1.8.1 + ECMAScript 5 Compliance 4 9.0 (JScript 9.0)

Versionsgeschichte von ECMAScript (ECMA-262)[Bearbeiten]

Die aktuelle Version ist die Version 5. Derzeit wird an der Version 6 mit dem Codename "Harmony" gearbeitet.[7][8]

Version publiziert am Unterschiede zur Vorgängerversion Editor
1 Juni 1997 erste Version Guy L. Steele, Jr.
2 Juni 1998 Änderungen zwecks Kompatibilität zum internationalen Standard ISO/IEC 16262 Mike Cowlishaw
3 Dezember 1999 Neu sind reguläre Ausdrücke, bessere Verarbeitung von Zeichenketten, Kontrollfluss, Fehlerbehandlung mit try/catch, bessere Fehlerbehandlung, bessere Formatierung bei der Ausgabe von Zahlen usw. Mike Cowlishaw
4 abgebrochen Wegen Uneinigkeit in Bezug auf die Zukunft der Sprache wurde die weitere Entwicklung des komplexen Entwurfes zu ECMAScript 4 eingestellt. Einige Ideen werden in ES6 wieder aufleben.
5 Dezember 2009 Im "strict mode" wird eine erweiterte Fehlerprüfung eingeschaltet. Unklare Sprachkonstrukte von ECMAScript 3 werden entschärft und neue Features wie getter- und setter-Methoden, Unterstützung von JSON usw. hinzugefügt.[9] Pratap Lakshman, Allen Wirfs-Brock
5.1 Juni 2011 Entspricht dem internationalen Standard ISO/IEC 16262:2011, Version 3 Pratap Lakshman, Allen Wirfs-Brock
6 in Arbeit Neue Syntax für komplexe Applikationen wie Klassen und Module, die aber mit ähnlicher Terminologie wie in ECMAScript 5 (strict mode) definiert werden können. Neue Sprachbestandteile wie for/of-Schleifen, teilweise an Python angelehnte Syntax usw. Der Codename lautet “ECMAScript Harmony” oder “ES6 Harmony”. Allen Wirfs-Brock
7 in Arbeit Weiterführung der mit ES6 begonnenen Änderungen.[10]

Sicherheit[Bearbeiten]

Sandbox-Prinzip[Bearbeiten]

JavaScript wird im Browser in einer so genannten Sandbox ausgeführt. Dies bewirkt, dass man in JavaScript im Allgemeinen nur Zugriff auf die Objekte des Browsers hat und somit nicht auf das Dateisystem zugreifen und dadurch keine Dateien lesen oder schreiben kann. Eine Ausnahme stellt der Lesezugriff auf eine Datei dar, die mittels eines mit dem HTML-Element <input type="file"> gestarteten Dateiauswahl-Dialogs vom Benutzer ausgewählt wurde. Ebenfalls kann diese Beschränkung in JScript bei entsprechenden Sicherheitseinstellungen durch die Nutzung von ActiveX umgangen werden.

Um Sicherheitsprobleme, wie das so genannte Cross-Site-Scripting zu verhindern, wird jede Website oder Webanwendung innerhalb des Browsers isoliert ausgeführt und ein Datenaustausch unterbunden. Ohne diesen Schutz wäre es möglich, über eine Seite Schadcode auszuführen, der beispielsweise Bank- oder Logindaten in anderen parallel geöffneten Browserfenstern ausliest oder manipuliert.

Auch bestimmte sicherheitsrelevante Browserfunktionen, wie das Schließen des Browserfensters, das Aus- und Einblenden von Symbolleisten, das Ändern der Browserstartseite, der Zugriff auf die Zwischenablage oder das Auslesen der zuletzt besuchten Webseiten des Anwenders, werden durch obligatorische Nutzereingaben geschützt.

Standardmäßig wird ein Skript innerhalb eines Browsers in Form eines einzigen Threads ausgeführt. Warteschleifen oder lange Berechnungen sind daher in JavaScript-Programmen zu vermeiden. Mit Worker-Objekten ist es möglich, weitere Threads zu erzeugen.[11]

Deaktivieren von JavaScript[Bearbeiten]

In fast allen JavaScript-fähigen Browsern lässt sich JavaScript abschalten oder lassen sich einzelne Aktionen, wie die Änderung des Textes in der Statusleiste oder die Manipulation von Browserfenstern, deaktivieren.

Sprachelemente[Bearbeiten]

Datentypen[Bearbeiten]

Der Datentyp eines Wertes lässt sich mit dem Operator typeof ermitteln.

Zeichenketten haben den Typ String (typeof liefert string), numerische Werte den Typ Number (typeof liefert number), boolesche Werte den Typ Boolean (typeof liefert boolean). Funktionen sind kein primitiver Typ; typeof liefert function. Ein Sonderfall ist der Typ undefined mit undefined als einzigem Wert. Für alle anderen Werte – reguläre Ausdrücke, Arrays und den Wert null inbegriffen – liefert typeof den Zeichenketten-Wert object zurück. Im Gegensatz zu anderen Programmiersprachen gibt es in JavaScript keine echten assoziativen Arrays.[12]

Mit den vordefinierten Konstruktorfunktionen String(), Number() und Boolean() erzeugte Objekte verhalten sich wie Werte der entsprechenden Datentypen – der typeof-Operator gibt jedoch object zurück:

var variable = "Beispieltext";
alert(typeof variable); // ergibt "string" (die Funktion "alert" gibt den ihr übergebenen Parameter in einem Fenster aus)
 
variable = new String("Beispieltext");
alert(typeof variable); // ergibt "object"

Umgekehrt werden Werte der primitiven Typen Number, Boolean und String bei Bedarf automatisch in Objekte der entsprechenden Konstruktorfunktion umgewandelt:

var variable = "Beispieltext";
alert(variable.length); // ergibt 12

JavaScript ist dynamisch typisiert, das heißt die Zuweisung von Werten an Variablen unterliegt keinen typbasierten Einschränkungen. Es gibt diverse Erweiterungen von JavaScript, welche eine statische Typisierung auf Wunsch ermöglichen beziehungsweise zwingend erfordern, zum Beispiel TypeScript von Microsoft.[13]

Kontrollstrukturen[Bearbeiten]

if-else (Bedingte Anweisung)[Bearbeiten]

if (bedingung) {
    anweisungen;
} else {
    anweisungen;
}

switch-Kontrollstruktur[Bearbeiten]

switch (variable) {
    case wert1 :
        anweisungen;
        break;
    case wert2 :
        anweisungen;
        break;
    default :
        anweisungen;
}

while-Schleife[Bearbeiten]

while (bedingung) {
    anweisungen;
}

do-while-Schleife[Bearbeiten]

do {
    anweisungen;
} while (bedingung);

for-Schleife[Bearbeiten]

for (startausdruck; bedingung; iterationsausdruck) {
    anweisungen;
}

for … in-Schleife[Bearbeiten]

Mit dieser Anweisung werden alle eigenen und ererbten Eigenschaften eines Objektes durchlaufen, die das interne Attribut Enumerable aufweisen.[14] Dieses Attribut wurde in ECMA Script 5 eingeführt und ist für bestimmte eingebaute Eigenschaften (wie z. B. die Funktion toString des Prototyps Object) nicht gesetzt, es kann allerdings im Regelfall vom Benutzer gesetzt (und entfernt) werden.[15] Bei jedem Schleifendurchgang wird einer angegebenen Variable der Eigenschaftsname zugewiesen.

for (var eigenschaftsname in objekt) {
    anweisungen;
}

Variablen[Bearbeiten]

Variablen sollten in JavaScript mit var deklariert werden und sind dann innerhalb des Scopes gültig, in dem sie deklariert wurden. Verwendet man Variablen ohne sie vorher explizit zu deklarieren, werden diese implizit als Eigenschaften des globalen Objects (im Browser window) deklariert; dieses Verhalten kann man durch die Anweisung use strict; unterbinden. Eine Besonderheit von JavaScript ist das Hoisting von Variablen, das dafür sorgt, dass sämtlich in einem Codeabschnitt deklarierten Variablen und Funktionen bei der Abarbeitung automatisch direkt am Anfang ausgeführt werden.

Geltungsbereich von Variablen[Bearbeiten]

Innerhalb von Funktionen oder als Funktionsparameter deklarierte Variablen haben eine lokale Gültigkeit; außerhalb von Funktionen deklarierte Variablen sind global gültig. Global bedeutet beim JavaScript in Browsern, dass derart deklarierte Variablen auf der ganzen Webseite und bei allen aktiven JavaScripts gültig sind. Da dies zu ungewollten Seiteneffekten mit anderen in der Seite eingebunden Scripts (wie Drittanbieter-Plugins, Web Analytics oder Werbebannern) führen kann, sollten Globale Variablen so weit wie möglich vermieden werden.

var a,b;                  // explizite Deklaration einer globaler Variablen
a = 1;                    // Definition einer Variable
document.write(a);        // ergibt 1
 
c = 2;                    // implizite Deklaration ohne var - es entsteht keine Variable, sondern ...
document.write(c);        // ergibt 2
document.write(window.c); // ... dem globalen Objekt (Window) wurde eine Eigenschaft zugewiesen
document.write(window.a); // Fehler 
 
function foo(e) {         // saubere Deklaration eines Funktionsparameters
    var f,g = 5;          // saubere Deklaration und Definition einer lokalen Variablen
    document.write(a);    // globale Variablen sind überall gültig
    document.write(c);    // Eigenschaften des globalen Objektes auch
    document.write(e);    // Funktionsparameter haben denselben Gültigkeitsbereich wie lokale Variablen
    h = 7;                // Verflucht, schon wieder eine globale Eigenschaft!
}
foo(a);
 
document.write(e);        // Fehler, da der Funktionsparameter e nur innerhalb der Funktion gültig ist
document.write(f);        // Fehler, da die Varaible f nur innerhalb der Funktion gültig ist
 
document.write(h);        // ergibt 7 
document.write(window.h); // ergibt 7 - das implizit deklarierte h ist eine Eigenschaft von window

Funktionen[Bearbeiten]

Funktionen sind in JavaScript vollwertige Objekte. Sie haben Methoden und Eigenschaften, können erstellt und überschrieben, als Argumente an Funktionen übergeben und von ihnen erzeugt und zurückgegeben werden.

Im letzteren Fall entsteht eine Closure (auch Funktionsabschluss genannt), mit der beispielsweise Datenkapselung umgesetzt werden kann:

var temp = function () {
    var geheimnis = 42;
    return function () {
        return geheimnis;
    };
}
var geheimnisträger = temp(); //geheimnisträger ist die von temp() zurückgegebene Funktion
alert(typeof geheimnis ); // undefined
alert(geheimnisträger()); // 42

Nicht jedes Argument einer Funktion muss beim Aufruf angegeben werden; für fehlende Argumente wird der Wert undefined gesetzt. Außerdem kann innerhalb der Funktion auch über das arguments-Objekt auf die Argumente zugegriffen werden.

Erzeugung[Bearbeiten]

Es gibt mehrere Möglichkeiten, in JavaScript Funktionen zu erzeugen:[16]

// 1: Funktionsdeklaration, a ist eine Funktion mit dem Namen a.
function a (Parameter1, Parameter2, Parameter3) {
    anweisungen;
    return ausdruck;
}
 
// 2: Funktionsausdruck ('function expression')
// 2.1: Normalfall, b ist eine anonyme Funktion
var b = function (...) {...}
 
// 2.2: benannter Funktionsausdruck ('named function expression')
// c ist hier eine Funktion mit dem Namen d. Außerhalb der
// Funktion ist sie mit c ansprechbar, innerhalb mit c und d.
var c = function d (...) {...}
 
// 3: Function-Konstruktor
var e = new Function('arg1', 'arg2', 'return arg1 + arg2');
 
// 4: 'expression closure' aus JavaScript 1.8, ähnlich dem Lambda-Kalkül
// kommt ohne geschweifte Klammern und return aus, gibt das Ergebnis von Ausdruck zurück
function f (...) ausdruck;

Eine funktionale Implementierung des Euklidischen Algorithmus in der rekursiven Variante sähe so aus:

// einfache Version
function euklid (a, b) {
    return b ? euklid(b, a%b) : a
}
 
// Version, die beliebig viele Argumente annimmt,
// rekursiv, funktional
// Ablauf:
// (1) Erzeuge ein Array aus den Argumenten von ggT
// (2) Wenn ggT nur (noch) ein Argument hat, gib dieses zurück, wenn es keines hat, 0
// (3) sonst rufe euklid mit dem ersten Argument
// (4) und dem Ergebnis des Ergebnisses von ggT mit den Argumenten 2 bis n auf
function ggT () {
    return (function (args) {
        return !args[1]
        ? function () { return args[0] || 0 } // (2)
        : function () { return euklid( // (3)
            args[0],
            ggT.apply(null, args.slice(1))() // (4)
        )}
    })(Array.prototype.slice.apply(arguments)) // (1)
}
 
ggT(4,6);        // ergibt eine Funktion, die 2 zurückgibt
// die zurückgegebene Funktion kann auch direkt ausgeführt werden:
ggT()();        // 0
ggT(4)();        // 4
ggT(4,6,8,102,244)();    // 2

Objekte[Bearbeiten]

Objekte in JavaScript bestehen aus Eigenschaften, die als Name/Wert-Paar realisiert werden. Dabei wird nicht zwischen Attributen und Methoden des Objektes unterschieden (eine Eigenschaft, deren Wert den Typ function bestitzt, fungiert als Methode). Jedes Objekt – auch durch Literale erzeugte Objekte – erbt vom Prototyp des globalen Object-Konstruktors.

Vordefinierte Objekte[Bearbeiten]

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

Abgesehen vom globalen Objekt sowie den beiden Objekten Math und JSON besitzen die vorstehend angeführten Objekte den mit dem typeof-Operator feststellbaren Typ "function". Sie können daher zur Erzeugung weiterer Objekte des entsprechenden Typs verwendet werden.

Die restlichen Objekte, die beim clientseitigen JavaScript verwendet werden, entstanden historisch vor allem durch die Netscape-Spezifikationen (window, document usw.). Das window-Objekt selbst ist dabei de facto das globale Objekt, indem einfach einer Variablen window das globale Objekt zugewiesen wurde. 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.

Zugriff auf Objekteigenschaften und -methoden[Bearbeiten]

Eigenschaften von Objekten (auch Methoden sind Eigenschaften) können wie folgt angesprochen werden:

Punkt-Notation (mit statischen Bezeichnern)
objekt.eigenschaft;
 
objekt.methode(parameter1, parameter2);
Klammer-Notation (mit dynamischen Bezeichnern)
objekt["eigenschaft"];
 
objekt["methode"](parameter1, parameter2);
 
// Eigenschaftsname, der in Punkt-Notation illegal wäre:
objekt["methode 1"]();
 
// Auf diese Weise können auch alle Eigenschaften des Objekts durchlaufen werden:
for (var eigenschaftsName in objekt) {
	console.log(eigenschaftsName,' = ',objekt[eigenschaftsName]);
}

Zu allen Objekten können zur Laufzeit neue Eigenschaften hinzugefügt oder mit dem delete bestehende entfernt werden:

// Statisch bzw. dynamisch benannte Eigenschaften hinzufügen:
objekt.eigenschaftA = "ein Wert";
objekt["eigenschaftB"] = "ein anderer Wert";
 
// Statisch bzw. dynamisch benannte Eigenschaften entfernen:
delete objekt.eigenschaftA;
delete objekt["eigenschaftB"];

Objektliterale[Bearbeiten]

Objekte können in JavaScript direkt anhand ihrer Eigenschaften definiert werden:

var meinObjekt = {
    zahl: 42,
    gibZahl: function () {
        return this.zahl;
    }
};
alert(meinObjekt.gibZahl()); // 42

Eine spezielle Notation gibt es für reguläre Ausdrücke:

// mit Konstruktorfunktion
(new RegExp("a")).test("ab"); // true
 
// als Literal
/a/.test("ab"); // true

Konstruktor-Funktionen[Bearbeiten]

Eine 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 Variable this angesprochen werden.

function MeinObjekt(x) { // Konstruktor
    this.zahl = x;
}
var objekt = new MeinObjekt(3); // Instanz erzeugen
alert(objekt.zahl); // per Meldefenster ausgeben (3)

„Private“ Eigenschaften[Bearbeiten]

Private Eigenschaften und Methoden sind nicht explizit Teil der Sprache.

Mit Hilfe von Closures (siehe Funktionen) lassen sich dennoch private Eigenschaften von Objekten realisieren:

var neue_katze = function () {
    var lebensZahl = 7;
    var maunz = function () {
        return (lebensZahl > 0) ? "miau" : "örks";
    };
 
    // gibt neues objekt zurück
    return {
        toeten: function () {
            lebensZahl -= 1;
            alert(maunz());
        }
    };
};
var otto = neue_katze();
otto.toeten(); // miau

Lediglich die toeten-Methode von otto kennt die Variable lebensZahl. Der Effekt gleicht dem einer privaten Eigenschaft, wenn alle Methoden der Katze in der erzeugenden Funktion neue_katze definiert werden. lebensZahl ist dann für alle Methoden (privilegierte Methoden, im Beispiel toeten) und inneren Funktionen der erzeugenden Funktion (private Methoden, im Beispiel maunz) sichtbar, nicht jedoch von außen oder von nachträglich an das Objekt gehängten Methoden.

Vererbung über Prototypen[Bearbeiten]

Vererbung kann in JavaScript durch Prototypen realisiert werden. Dies erfordert, dass der prototype-Eigenschaft einer Konstruktor-Funktion ein als Prototyp dienendes Objekt zugewiesen wird. Wenn mit der Konstruktor-Funktion nun ein Objekt erzeugt wird, wird beim Zugriff auf eine nicht-existierende Eigenschaft des neuen Objekts die entsprechende Eigenschaft des Prototyps (wenn vorhanden) zurückgegeben. Beispiel:

var fisch = {
    augen: 2
};
 
var Mutantenfisch = function () {
    this.augen = 3;
};
Mutantenfisch.prototype = fisch;
 
var blinky = new Mutantenfisch();
 
alert(blinky.augen); // 3 - eigene Eigenschaft von blinky
delete blinky.augen; // blinkys eigene Eigenschaft wird gelöscht
alert(blinky.augen); // 2 - blinky hat die Eigenschaft selbst nicht mehr, es schimmert die Eigenschaft des Prototyps durch

Um festzustellen, ob ein Objekt eine Eigenschaft selbst besitzt oder vom Prototyp geerbt hat, hat jedes Objekt (automatisch durch Vererbung von Object) die hasOwnProperty-Methode:

blinky.hasOwnProperty('augen'); // false

Delegationsprinzipien[Bearbeiten]

JavaScript ist eine Delegationssprache mit sowohl selbstausführendem als auch direktem Delegationsmechanismus.

Funktionsobjekte als Rollen (Traits und Mixins)
JavaScript unterstützt schon auf der Ebene des Sprachkerns verschiedene auf Funktionsobjekten aufbauende Implementierungen des Rollen[17]-Musters[18] wie Traits[19][20] und Mixins.[21][22] Zusätzliches Verhalten wird bereitgestellt, indem mindestens eine Methode über das Schlüsselwort this im Rumpf eines function-Objekts gebunden wird. Benötigt ein Objekt zusätzliches Verhalten, welches ihm nicht über die Prototypenkette zur Verfügung gestellt werden kann, lässt sich eine Rolle direkt über call bzw. apply an dieses Objekt delegieren.
Objektkomposition und Vererbung durch Delegation
Während Komposition in JavaScript über diese direkte Delegation abgedeckt werden kann, kommt automatische Delegation immer dann zur Anwendung, wenn der Interpreter die Prototypenkette eines Objekts nach oben hin abwandern muss, um z. B. eine mit diesem Objekt assoziierte Methode zu finden, die diesem nicht unmittelbar gehört. Sobald die Methode gefunden ist, wird sie im Kontext dieses Objekts aufgerufen. Demzufolge wird Vererbung in JavaScript über einen selbstausführenden Delegationsmechanismus abgebildet, der an die prototype-Eigenschaft von Konstruktorfunktionen gebunden ist.

Fehlerbehandlung[Bearbeiten]

Seit Version 3 verfügt ECMAScript über eine von Java übernommene Fehlerbehandlung. Die Anweisung try … catch … finally fängt Ausnahmen (exceptions) ab, die aufgrund eines Fehlers oder einer throw-Anweisung auftreten. Die Syntax lautet:

try {
    // Anweisungen, in denen Ausnahmen auftreten oder ausgelöst werden können
} catch (exception) {
    // 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";    // wenn verfügbar, besser: Error-Objekt (siehe unten)

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.

Einige Laufzeitumgebungen wie V8 (und somit Node.js) und auch viele Webbrowser stellen gesonderte Error-Objekte zur Verfügung, die neben der Fehlermeldung auch einen Stacktrace und weitere Zusatzinformationen transportieren können.[23][24][25] Um diese Vorteile zu nutzen, ändert man im einfachsten Anwendungsfall den throw-Befehl von throw "Meldungstext"; zu throw new Error("Meldungstext");.[26]

Klammern um den Parameter des throw-Befehls sind im Allgemeinen nicht notwendig.[27] Sollten sie in Ausnahmefällen benötigt werden, um beispielsweise einen auf mehrere Zeilen verteilten Parameter zusammenzufassen, kann die mögliche Verwechslung mit einem Funktionsaufruf dennoch vermieden werden, indem man ein Leerzeichen zwischen throw und die öffnende Klammer einfügt.

JavaScript-Bibliotheken[Bearbeiten]

Für die Erstellung von browserübergreifenden Webanwendungen mit Hilfe von JavaScript stehen JavaScript-Bibliotheken, sogenannte Toolkits bereit. Es handelt sich dabei um eine Sammlung von JavaScript-Funktionen, die den JavaScript-Programmierer in seiner Arbeit unterstützen sollen. Toolkits, die nicht nur häufig benutzte Standardfunktionen zur Verfügung stellen, sondern durch ein besonderes Maß an Abstraktion eine grundlegend andere Programmierung nach sich ziehen, werden auch Frameworks genannt.

Ausgelöst von neuen Konzepten wie Ajax entstand seit 2004 ein neues Interesse für JavaScript. JavaScript wird zunehmend für Rich-Client-Anwendungen benutzt, die das Aussehen und die Bedienung von herkömmlichen Desktop-Programmen auf Web-gestützte Anwendungen übertragen. JavaScript spielt dabei eine Schlüsselrolle, wenn es darum geht, Statusinformationen ohne Laden einer vollständigen Seite zwischen Browser und HTTP-Server zu übertragen. Im Zuge dieser neuen Anforderungen entstanden verschiedene Bibliotheken, die die Entwicklung solcher Anwendungen vereinfachen wollen. Neben Ajax-Funktionalitäten bieten die meisten dieser Bibliotheken eine eigene Basis für objektorientierte Programmierung, eine Abstraktionsschicht für das komfortable Arbeiten mit dem DOM sowie grafische Effekte wie Animationen. Aber auch schon vor dem breiten Einsatz von Ajax existierten Funktionssammlungen zur Unterstützung der browserübergreifenden Programmierung.

Zu den bekannten JavaScript-Bibliotheken und Frameworks zählen AngularJS, Dojo Toolkit, Ext JS, jQuery, MooTools, Prototype, Qooxdoo und die Yahoo User Interface Library. Speziell mit grafischen Effekten beschäftigen sich Moo.fx und Script.aculo.us.

Einige JavaScript-Projekte implementieren eigene oder bereits existente andere Sprachen, um die Ausdrucksmöglichkeiten von Javascript zu erweitern, in anderen Sprachen geschriebene Skripte im Browser ausführen zu können, oder einfach zur Unterhaltung oder als Demonstration. Auch für JavaScript selbst existiert ein in JS geschriebener Interpreter, Narcissus.

Beispiel-Bibliothek: Dialogmethoden / Benutzereingaben[Bearbeiten]

Meistens erfolgt die Interaktion mit dem Benutzer über Änderungen an Inhalten des HTML-Dokuments, insbesondere über Formulare im Dokument, dabei greift JavaScript über das DOM (Document Object Model) auf die Elemente des HTML-Dokuments zu. Außerdem stehen drei Methoden des Window-Objektes bereit: alert(), confirm() und prompt(); mit jeder einzelnen dieser Methoden kann man den Benutzer auffällig ansprechen bzw. zu einer Eingabe auffordern. Dafür zeigt eine solche Methode ein modales Fenster an; modal bedeutet, der Benutzer muss dieses Fenster zunächst schließen, bevor er zum aufrufenden Dokument zurückkehren kann.

Alarmfenster:
Zeigt einen Text in einem eigenen Meldungsfenster an. Beispiel:

window.alert("Hello World");

Bestätigungsfrage:
Zeigt einen Dialog mit den Schaltflächen „OK“ und „Abbrechen“ an. Zurückgegeben wird einer der booleschen Werte true oder false, je nachdem welche Schaltfläche der Benutzer auswählt.

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

Eingabeaufforderung:
Es wird ein Dialog zur Texteingabe angezeigt. Beispiel:

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

In einem fertigen Script sind diese Methoden eher selten anzutreffen, während der Script-Entwicklung hingegen werden sie gerne benutzt, um Fehler auszumachen, um mit geringem Aufwand einen Variablenwert zu prüfen oder um festzustellen, ob eine bestimmte Stelle im Script überhaupt erreicht wird.

Siehe auch[Bearbeiten]

Literatur[Bearbeiten]

  • Ralph Steyer: JavaScript. Einstieg für Anspruchsvolle. Addison-Wesley, München 2006, ISBN 3-8273-2466-1
  • Michael Seeboerger-Weichselbaum: Das Einsteigerseminar JavaScript. 4. Auflage. bhv, Bonn 2007, ISBN 3-8266-7472-3
  • Ralph Steyer: Das JavaScript Codebook. Addison-Wesley, München 2008, ISBN 3-8273-2717-2
  • Douglas Crockford: Das Beste an JavaScript. O’Reilly, Köln 2008, ISBN 3-89721-876-3
  • Christian Wenz: JavaScript und AJAX. Das umfassende Handbuch. 9. Auflage. Galileo Press, Bonn 2009, ISBN 3-89842-859-1 (Online-Fassung)
  • Stefan Koch: JavaScript. Einführung, Programmierung, Referenz – inklusive Ajax. 5. Auflage. dpunkt-Verlag, Heidelberg 2009, ISBN 3-89864-594-0
  • David Flanagan: JavaScript – das umfassende Referenzwerk. 6. Auflage. O’Reilly, Köln 2012, ISBN 3-86899-135-2
  • David Flanagan: JavaScript – kurz & gut. 4. Auflage. O’Reilly, Köln 2012, ISBN 3-86899-388-6
  • Peter Kröner: ECMAScript 5 – Entwickeln mit dem aktuellen JavaScript-Standard. 1. Auflage. Open Source Press, München 2013, ISBN 978-3-95539-063-1

Weblinks[Bearbeiten]

 Commons: JavaScript – Sammlung von Bildern, Videos und Audiodateien
 Wikibooks: Websiteentwicklung: JavaScript – Lern- und Lehrmaterialien
 Wiktionary: JavaScript – Bedeutungserklärungen, Wortherkunft, Synonyme, Übersetzungen

Spezifikationen[Bearbeiten]

Dokumentationen[Bearbeiten]

Einzelnachweise[Bearbeiten]

  1. a b JavaScript für Mikrocontroller. heise online
  2. a b Tessel: JavaScript-Entwicklerboard fürs „Internet der Dinge“. heise online
  3. Brendan Eich: JavaScript at Ten Years (MS PowerPoint; 576 kB), 2005, im Internet Archive.
  4. Markeneintrag #75026640 beim USPTO für JavaScript. United States Patent and Trademark Office, abgerufen am 24. Oktober 2012 (englisch).
  5. Scripting for the Java Platform. In: Java SE Documentation. Oracle, abgerufen am 24. Oktober 2012 (englisch).
  6. John Resig: Versions of JavaScript. Ejohn.org. Abgerufen am 19. Mai 2009.
  7. Nicholas C. Zakas: Professional JavaScript for Web Developers. John Wiley & Sons, 2011, ISBN 978-1-118-23309-2.
  8. Draft Specification for ES.next (Ecma-262 Edition 6)
  9. Changes to JavaScript, Part 1: EcmaScript 5
  10. ES Wiki strawman:strawman
  11. Spezifikation von Web Workers durch das W3C (World Wide Web Consortium)
  12. Assoziative Arrays, abgerufen am 19. April 2013
  13. Ilja Zaglov: TypeScript: Microsoft’s neue JavaScript Erweiterung. In: t3n Magazin. 10. Oktober 2012, abgerufen am 10. Oktober 2012.
  14. for...in MDN
  15. Object.defineProperty() MDN
  16. siehe auch: Named function expressions demystified
  17. Role-oriented programming in der englischsprachigen Wikipedia
  18. Peter Seliger: Die vielen Talente von JavaScript: Rollen-orientierte Programmieransätze wie Traits und Mixins verallgemeinern […]. In: Blogspot.de. 5. Juni 2014, abgerufen am 26. August 2014 (deutsch).
  19. Traits for Javascript, 2010.
  20. CocktailJS - ANNOTATIONS. TRAITS. TALENTS., April 2013.
  21. Angus Croll: A fresh look at JavaScript Mixins. 31. Mai 2011.
  22. JavaScript Code Reuse Patterns vom 19. April 2013.
  23. JavaScript Stack Trace API in Google V8 Wiki, Stand 28. Juni 2010, abgerufen: 23. Februar 2013, 09:30 UTC
  24. JavaScript Core Reference: Error in Aptana HTML Reference, Stand 2. Juli 2012, abgerufen: 23. Februar 2013, 09:30 UTC
  25. Report Unhandled Errors from JavaScript. 13. April 2013, abgerufen am 16. April 2013 (englisch, Fehlerprotokollierung mit Stacktrace in JavaScript).
  26. Nico Reed: What is the error object? In: Nodejitsu Documentation, Stand 26. August 2011, abgerufen: 23. Februar 2013
  27. Abschnitt 12.13 "The throw Statement" in Standard ECMA-262, 5.1 Edition: ECMAScript Language Specification, Stand Juni 2011, abgerufen: 23. Februar 2013, 09:30 UTC