Einführung
Was ist JavaScript?
JavaScript ist eine Skriptsprache, die 1995 von Brendan Eich bei Netscape Communications entwickelt wurde. Eine Skripsprache ist eine Programmiersprache, die eher für kleinere Programme, d. h. sog. Skripte, gedacht ist. JavaScript ist, wie die meisten Skriptsprachen, eine Interpretersprache, bei welcher der Quelltext erst zur Laufzeit von einem sog. Interpreter des Browsers eingelesen, analysiert und übersetzt wird. Außerdem ist JavaScript eine typenlose bzw. dynamisch typisierte Programmiersprache, bei der für die Variablen kein spezieller Typ angegeben werden muss und eine Typenprüfung erst zur Laufzeit des Programms stattfindet. 1997 wurde JavaScript unter der Bezeichnung ECMAScript von der ECMA (European Computer Manufacturers Association) als Standard ECMA-262 veröffentlicht. Die ECMA ist eine private, internationale Normungsorganisation, die neben JavaScript auch C# standardisiert hat.
Versionen von JavaScript (ECMAScript)
Version | Datum | Beschreibung |
1 | 1997 | Erste Version |
2 | 1998 |
Abgleich mit dem internationalen Standard ISO/IEC 16262 |
3 | 1999 |
Reguläre Ausdrücke; bessere Verarbeitung von Zeichenketten;
Fehlerbehandlung mit „try/catch“ |
4 | nie veröffentlicht |
Wegen Uneinigkeit in Bezug auf die Zukunft der Sprache
eingestellt |
5 | 2009 |
Erweiterte Fehlerprüfung; „getter“- und „setter“-Methoden;
Unterstützung von JSON |
5.1 | 2011 | Abgleich mit dem internationalen Standard ISO/IEC 16262 |
6 / 2015 | 2015 |
Klassen und Module; „for/of“-Schleifen |
7 / 2016 | 2016 |
Potenzfunktion „**“; „Array.prototype.includes“ |
8 / 2017 | in Arbeit |
Einsatzgebiete von JavaScript
Mit JavaScript kann der Inhalt einer Webseite generiert, verändert und nachgeladen werden. Damit kann eine Webseite dynamisch zur Laufzeit auf Benutzerinteraktionen reagieren. JavaScript gehört beim Webdesign zu den drei wichtigsten Webtechnologien. Mit HTML wird der Inhalt, mit CSS das Design und mit JavaScript das Verhalten einer Webseite definiert. Es gibt aber auch auf JavaScript basierende Bibliotheken (z. B. „node.js“), mit denen serverseitige Anwendungen und Komponenten implementiert werden können.
Die Hauptaufgabe von JavaScript liegt in der Interaktion mit dem Benutzer. Dazu muss JavaScript Zugriff auf die Elemente einer Webseite haben und diese manipulieren können. Dazu gibt es das DOM (Document Object Model). Das DOM ist eine vom W3C (World Wide Web Consortium) definierte Spezifikation einer Schnittstelle für den Zugriff auf HTML-Elemente. Beim Erstellen einer Webseite aus HTML-Dokumenten durch den Browser, erstellt dieser auch das DOM. Dadurch entsteht eine Baumstruktur von Objekten, basierend auf den HTML-Elementen. Die Elemente im DOM können dann mit Hilfe von JavaScript angesprochen, manipuliert und gelöscht werden. Außerdem können mit JavaScript auch neue Objekte dem DOM hinzugefügt werden. Diese Änderungen finden aber nur im Browser auf dem Rechner des Besuchers einer Webseite statt, während die HTML-Dokumente auf dem Webserver unangetastet bleiben.
Webseiten mit HTML, CSS und JavaScript
Client-Server-Prinzip
Die Webseiten im World Wide Web bestehen i. d. R. aus HTML-, CSS- und JavaScript-Dateien, die von sog. Webservern bereitgestellt werden. Für das Anfragen, Empfangen und Darstellen von Webseiten werden Webbrowser verwendet. Für die Kommunikation zwischen Webserver und Webbrowser wird das Protokoll HTTP, bzw. die verschlüsselnde Variante HTTPS, verwendet.
Browser-Engine
Das Programm, das innerhalb eines Browsers den HTML-, CSS- und JavaScript-Code in eine darstellbare Webseite umwandelt, nennt sich Browser-Engine (auch Renderer oder Rendering-Engine). Die Stylesheets werden i. d. R. mit CSS beim Webdesign zusammen mit den HTML-Dokumenten erstellt. Wird keine CSS-Datei angegeben, verwenden Browser ihre eigenen Standard-Stylesheets. Eine Browser-Engine verwendet die Struktur und semantische Definitionen der Webseiten-Elemente aus dem HTML-Dokument und die Design-Definitionen aus der CSS-Datei und erstellt daraus die eigentliche Webseite.
Parser
Der Vorgang bei dem aus dem HTML-Dokument die Webseiten-Struktur entsteht wird als Parsen bezeichnet. Auch das Umsetzen der Definitionen aus dem CSS-Dokument wird als Parsen bezeichnet. Somit gibt es für die HTML-Dokumente und für die CSS-Dokumente in der Browser-Engine jeweils einen Parser.
Document Object Model
Beim HTML-Parsing wird basierend auf dem HTML-Dokument ein sog. „Document Objekt Model“ (kurz DOM) erstellt. Das DOM stellt die Webseiten-Struktur als hierarchischen Baum dar. Mit einer von Browsern unterstützten Programmiersprache (z. B. JavaScript), kann über das DOM auf die einzelnen Elemente einer Webseite zugegriffen und diese manipuliert werden.
Aufbau einer Browser-Engine
Eine Webseite besteht i. d. R. aus HTML-, CSS- und JavaScript-Dateien, die von einem Webserver an einen Webbrowser übertragen und von der Browser-Engine des Webbrowsers zur eigentlichen Webseite zusammengesetzt werden. Eine Browser-Engine besteht zusammenfassend mindestens aus einem HTML-Parser, einem CSS-Parser, einer JavaScript-Engine und einer Schnittstelle (API), über die der Browser auf die Browser-Engine zugreift. Durch diesen flexiblen Aufbau ist es auch möglich, dass verschiedene Browser die selbe Browser-Engine verwenden können.
Die bekanntesten Browser-Engines
Die folgende Tabelle zeigt die bekanntesten Browser-Engines und ihre hauptsächliche Verwendung:
Browser-Engine | Verwendung | Bemerkungen |
WebKit | Safari, (Chrome bis Vers. 27) | |
Blink | Opera (ab Vers. 15), Chrome (ab Vers. 28) | 2013 von Webkit abgespalten |
Gecko | Firefox | |
Trident | Internet-Explorer für Windows | |
Tasman | Internet-Explorer für Macintosh | |
EdgeHTML | Microsoft-Edge für Windows 10 |