Woche 3

Tag 18

Top-Level-Objekte und das Objekt navigator

Am heutigen Tag wollen wir uns um das navigator-Objekt und zwei wichtige Unterobjekte von window, location und history sowie die wichtigsten derjenigen Objekte kümmern, die man als Top-Level-Objekte (Objekte, die direkt an jeder Stelle in einem JavaScript zur Verfügung stehen) bezeichnet. Dies sind die Objekte

Array
Boolean
Date
Function
Math
Number
RegExp
Screen
String

Ebenso soll heute auf dem Plan stehen, wie Browser und Plattformen beim Laden einer Webseite automatisch erkannt werden und wie man dann darauf reagieren kann. Etwa zu verschiedenen Webseiten weiterleiten.

Array

Um Arrays haben wir uns ja schon an Tag 15 gekümmert. Hier soll nur noch die Auflistung der wichtigsten Eigenschaften und Methoden angegeben werden. Das Array-Objekt wurde in JavaScript 1.1 eingeführt und JavaScript 1.3 fügte die Methode toSource() hinzu und überarbeitete die length-Eigenschaft sowie die Methoden push() und splice().

Eigenschaften

Eigenschaften	Description
`constructor`	Spezifiziert die Funktion, die den Prototyp eines Objekts kreiert
`length`	Anzahl der Elemente in einem Array
`prototype`	Erlaubt das nachträgliche Hinzufügen von Eigenschaften zu einem Array-Objekt

Tabelle 18.1: Eigenschaften von Array

Die Eigenschaften constructor und prototype werden bei fast allen Objekten bereitstehen und nachfolgend nur noch erwähnt.

Methoden

Methode	Beschreibung
`concat()`	Verbindet zwei Arrays und gibt ein neues Array zurück.
`join(` `[Trennzeichen])`	Liefert eine Zeichenkette der Elemente eines Arrays mit den angegebenen Trennzeichen.
`pop()`	Entfernt das letzte Element aus einem Array und gibt es zurück.
`push(Element1,` `..., ElementN)`	Fügt ein oder mehr Elemente an das Ende von einem Array ein und gibt die neue Länge des Arrays zurück.
`reverse()`	Dreht die Reihenfolge der Elemente in einem Array um.
`shift()`	Entfernt das erste Element aus einem Array und gibt es zurück.
`slice(Beginn` `[,Ende])`	Extrahiert eine Auswahl von Elementen ab einem Beginn bis zu einer optionalen Endangabe.
`splice(Index,` `Anzahl,` `[Element1]` `[, ...,` `ElementN])`	Eine Methode zum gezielten Entfernen oder Hinzufügen von Elementen ab dem angegebenen Index. Wenn bei `Anzahl` 0 angegeben wird, wird kein Element entfernt; die nachfolgend angegebenen optionalen Elemente werden in jedem Fall hinzugefügt.
`sort(` `[Vergleichsfunktion])`	Sortiert die Elemente von einem Array nach ihrem Wert und der angegebenen Vergleichsfunktion.
`toSource()`	Rückgabe der String-Repräsentation des Codes.
`toString()`	Gibt das Array als String-Repräsentation zurück.
`unshift(` `Element1, ...,` `ElementN)`	Fügt ein oder mehr Elemente an den Anfang von einem Array ein und gibt die neue Länge des Arrays zurück.
`valueOf()`	Gibt den primitiven Wert von einem Array zurück.

Tabelle 18.2: Methoden von Array

Die Methoden toSource(), toString() und valueOf() werden bei fast allen Objekten bereitstehen und nachfolgend nur noch erwähnt.

Boolean

Das Objekt Boolean dient dazu, Boolsche Objekte zu erstellen. Diese können in JavaScript wie einfache boolsche Werte verwendet werden, denn JavaScript ruft bei der Angabe von Boolean-Objekten in entsprechenden Situationen automatisch die zugehörigen Methoden valueOf() auf, um den enthaltenen Wert auszulesen. Das Objekt hat nur wenige Methoden (toSource(), toString() und valueOf()) und Eigenschaften (constructor und prototype) und wegen der ähnlichen Anwendung wie die boolschen Werte eine nicht so große Bedeutung. Der Nutzen von Boolean zeigt sich, wenn eine explizite Umwandlung eines Ausdrucks in einen Wahrheitswert gewünscht ist.

Date

Das Objekt Date ist in JavaScript für Aktionen rund um Datum und Zeit zuständig. Der 1. Januar 1970, 0.00 Uhr ist der interne Zeitnullpunkt, der als Speicherungs- und Berechnungsbasis für alle Operationen dient. Ein Datumsobjekt kann mit folgenden Konstruktoren erzeugt werden:

new Date()
new Date(millisekunden)
new Date(DatumsString)
new Date(Jahr, Monat, Tag, 
[, Stunde, Minute, Sekunde, Millisekunde])
new Date(Jahr, Monat, Tag, 
[, Stunde, Minute, Sekunde])

Wir wollen uns die nachfolgenden drei Varianten anschauen:

var [Objektname] = new Date() 
var [Objektname]= new Date(Jahr,Monat,Tag) 
var [Objektname]
= new Date(Jahr,Monat,Tag,Stunden,Minuten,Sekunden)

Variante (1) erzeugt eine Objektinstanz, in der das zum Zeitpunkt der Programmausführung aktuelle Datum und die aktuelle Uhrzeit (Systemzeit des Rechners) gespeichert wird. Die Varianten (2) und (3) initialisieren das neue Date-Objekt mit bestimmten Werten (also einem bestimmten Datum und einer bestimmten Uhrzeit). Alle Initialisierungswerte bei Variante 2 und 3 (Monat, Stunden oder Minuten) müssen in Zahlenform angegeben werden.

Das Objekt Date besitzt nur die Eigenschaften constructor und prototype, aber eine ganze Reihe von Methoden, von denen eine Auswahl der wichtigsten hier folgt.

Methoden

Methoden	Beschreibung
`getDate()`	Der Monatstag des Objekts als Zahl, beispielsweise 3, wenn der 3.12.1991, 23:59:00, gespeichert ist.
`getDay()`	Der Wochentag des Objekts als Zahl, etwa 3, wenn implizit ein Mittwoch gespeichert ist. Die möglichen Rückgabewerte sind 0 (Sonntag) bis 6 (Samstag).
`getHours()`	Die Stunden der im Objekt gespeicherten Uhrzeit.
`getMinutes()`	Die Minuten der im Objekt gespeicherten Uhrzeit.
`getMonth()`	Der Monat des im Objekt gespeicherten Datums.
`getSeconds()`	Die Sekunden der im Objekt gespeicherten Uhrzeit.
`getTime()`	Die Methode gibt die Anzahl Millisekunden als Zahl zurück, die seit dem 1. Januar 1970, 0:00:00, bis zu dem im Objekt gespeicherten Zeitpunkt vergangen sind.
`getTimeZoneoffset()`	Die Methode gibt den Unterschied zwischen lokaler Zeit und Greenwich Meridian Time (GMT) in Anzahl Minuten zurück.
`getYear()`	Das Jahr des im Objekt gespeicherten Datums.
`parse(Zeitpunkt)`	Diese Methode ermittelt aus einer zu übergebenden Zeichenkette Zeitpunkt die Anzahl Millisekunden, die zwischen dem 1.1.1970 0:00:00, und dem übergebenen Zeitpunkt verstrichen sind. Die Zeichenkette Zeitpunkt muss dem IETF-Standard folgen. Beispiele: "Wed, 16Oct 1991 23:59:00 GMT", oder »Mon, 11Dec 1995 15:30:00 GMT+0430« .
`setDate(Tag)`	Hiermit ändert man den in dem Objekt gespeicherten Monatstag auf den als Zahl zu übergebenden Monatstag.
`setHours(Stunden)`	Veränderung der in dem Objekt gespeicherten Stunden der Uhrzeit auf die als Zahl zu übergebenden Stunden. Die übergebenen Werte können zwischen 0 und 23 liegen.
`setMinutes(Minuten)`	Ändert die in dem Objekt gespeicherten Minuten der Uhrzeit auf die als Zahl zu übergebende Minutenzahl. Werte zwischen 0 und 59 sind erlaubt.
`setMonth(Monat)`	Ändert den in dem Objekt gespeicherten Monat auf den als Zahl zu übergebenden Monat. Es sind Werte zwischen 1 und 12 als Übergabeparameter erlaubt.
`setSeconds(Sek)`	Verändert die in dem Objekt gespeicherten Sekunden der Uhrzeit auf die als Zahl zu übergebenden Sekunden. Es gibt Übergabewerte zwischen 0 und 59.
`setTime(Millisek)`	Diese Methode ändert den kompletten Inhalt von dem Objekt auf einmal durch Übergeben einer Zahl. Diese Zahl stellt die Anzahl der Millisekunden seit dem 10.01.1970 - 0:00:00 Uhr dar.
`setYear(Jahr)`	Hier wird das in dem Objekt gespeicherte Jahr auf das als Zahl zu übergebende Jahr geändert.
`toGMTString()`	Diese Methode wandelt die in dem Objekt gespeicherten Daten in eine Zeichenkette nach dem IETF-Standard um.
`toLocaleString()`	Diese Methode wandelt die in dem Objekt gespeicherten Daten in eine Zeichenkette um. Der Unterschied zur Methode toGMTString() ist der, dass die zurückgegebene Zeichenkette die lokale Uhrzeit berücksichtigt.
`UTC(Jahr, Monat, Tag [, Stunden] [, Minuten] [,Sekunden])`	Die Methode gibt die Anzahl Millisekunden zurück, die zwischen dem 1.1.1970 - 0:00:00 Uhr und dem übergebenen Zeitpunkt verstrichen sind. Alle Parameter sind als Zahlenwerte zu übergeben. Die Angabe der Datumswerte ist zwingend, die der Uhrzeitwerte optional.

Tabelle 18.3: Methoden von Date

Function

Das Objekt Function ist ein selten verwendetes Objekt. Es dient dazu, einen alternativen Weg zur Definition einer Funktion beschreiten zu können. Es wird genau genommen ein Function-Objekt erzeugt, was es ermöglicht, in JavaScript objektorientierter zu arbeiten. Wir wollen nicht näher darauf eingehen, sondern nur ein kleines Beispiel demonstrieren.

Beispiel 1:

Erstellen Sie die Datei Funktion.htm:

<HTML>
<SCRIPT language="JavaScript">
berechne = new Function("a","b","return a + b");
alert(berechne(1,2));
</SCRIPT>
<BODY>
</BODY>
</HTML>
 Abbildung 18.1:   Einsatz von Function

Math

Mit dem Objekt Math stehen Ihnen diverse Funktionen, Methoden und Eigenschaften für Berechnungen zur Verfügung. Eine Instanz des Objekts brauchen Sie nicht eigens erzeugen, da es sich um ein so genanntes »built in«-Objekt handelt. Sie haben automatisch Zugriff auf Eigenschaften und Methoden von Math über die folgende Syntax:

Math.[Eigenschaft/Methode]

Eigenschaften

Das Objekt Math besitzt eine ganze Menge von Konstanten und Eigenschaften. Hier nur eine kleine Auswahl.

Eigenschaft	Beschreibung
`E`	Die Eulersche Konstante
`LN10`	Der natürliche Logarithmus von 10
`LOG2E`	Der Logarithmus von 2
`PI`	Die berühmte Konstante Pi
`SQRT2`	Eine Konstante für Quadratwurzel aus 2

Tabelle 18.4: Eigenschaften von Math

Methoden

Das Objekt Math besitzt eine ganze Reihe von Methoden, welche Sie sehr wahrscheinlich zum großen Teil nicht benötigen werden. Hier folgt aber eine kleine Auswahl.

Methode	Beschreibung
`abs(Zahl)`	Der absolute Wert des übergebenen Parameters. Dies ist immer ein positiver Wert, selbst wenn er vorher negativ war.
`cos(Zahl)`	Die Methode berechnet den Cosinus des übergebenen Parameters, einer beliebigen Zahl.
`exp(Zahl)`	Die Methode berechnet die Eulersche Zahl hoch dem übergebenen Parameter, einer beliebigen Zahl.
`log(Zahl)`	Die Methode berechnet den Logarithmus zur Basis 10 von dem übergebenen Parameter, einer beliebigen Zahl.
`max(Zahl1, Zahl2)`	Die Methode berechnet das Maximum von zwei beliebigen als Parameter übergebenen Zahlen.
`min(Zahl1, Zahl2)`	Die Methode berechnet das Minimum von zwei beliebigen als Parameter übergebenen Zahlen.
`pow(Zahl, Exponent)`	Die Methode berechnet den Wert von Zahl hoch Exponent, wobei Zahl und Exponent als Parameter übergeben werden.
`random()`	Erzeugt eine Zufallszahl zwischen 0 und 1.
`round(Zahl)`	Die Methode berechnet die nächste Ganzzahl des übergebenen Parameters, einer beliebigen Zahl. Dabei wird die kaufmännische Rundung angewendet. Falls die Zahl selbst ganzzahlig ist, wird sie nicht verändert.
`sin(Zahl)`	Die Methode berechnet den Sinus des übergebenen Parameters, einer beliebigen Zahl.
`sqrt(Zahl)`	Die Methode berechnet die Quadratwurzel des übergebenen Parameters, einer beliebigen Zahl.
`tan(Zahl)`	Der Tangens einer als Parameter übergebenen Zahl.

Tabelle 18.5: Methoden von Math

Number

Das Objekt Number dient zur Unterstützung der Arbeit mit nummerischen Werten. Bei vielen Berechnungen ist es sehr hilfreich. Besonders, wenn Bedingungen eintreten wie Unendlichkeit oder irgendwelche Grenzwerte. Es fungiert als ein Objekt-Wrapper für primitive nummerische Werte.

Ein Wrapper dient dazu, mit Hilfe des new-Schlüsselworts jeweils ein Objekt-Gegenstück zu einem primitiven Datentyp zu erstellen.

Der Number-Konstruktor sieht so aus:

new Number([nummerischer Wert])

Man setzt dieses Objekt ein, um Zugriff auf spezielle darüber verfügbare Methoden zu haben oder nummerische Objekte zu erstellen, denen man bestimmte Eigenschaften noch hinzufügen möchte.

Eigenschaften

Eigenschaft	Beschreibung
`MAX_VALUE`	Größte darstellbare Zahl.
`MIN_VALUE`	Kleinste darstellbare Zahl
`NaN`	Not a Number.
`NEGATIVE_INFINITY`	Repräsentation von »Negativ-unendlich«; wird bei einer Berechnung bei einem Überlauf zurückgegeben.
`POSITIVE_INFINITY`	Repräsentation von »Positiv-unendlich«; wird bei einer Berechnung bei einem Überlauf zurückgegeben.

Tabelle 18.6: Eigenschaften von Number.

Daneben gibt es noch die allgemeinen Eigenschaften prototype und constructor.

Methoden

Das Objekt stellt nur die allgemeinen Methoden toSource(), toString() und valueOf() bereit.

RegExp

Das Objekt RegExp ist eines der leistungsfähigsten Objekte, auf das man unter JavaScript zugreifen kann. Es ist aber auch eines der komplexesten, weshalb es hier nur sehr komprimiert vorgestellt wird. Es handelt sich um ein Objekt, mit dem sehr detailliert Informationen zum Suchen von Ausdrücken spezifiziert werden können. Dazu gibt es eine umfangreiche Liste von Eigenschaften und Methoden, aber vor allem eine ganze Familie von Token mit spezieller Bedeutung. Da das Thema extrem umfangreich ist¹ und andererseits ein nur sehr spezialisiertes Anwendungsgebiet abdeckt, soll explizit auf den Anhang und weiterführende Literatur verwiesen werden.

screen

Ein sehr spannendes Objekt ist screen. Das Objekt beinhaltet keine Methoden, aber einige Eigenschaften. Darüber haben Sie Zugriff auf diverse plattformspezifische Informationen beim Anwender, genau genommen im Wesentlichen die Auflösung und die beim Anwender verfügbaren Farben.

Wir wollen diese screen-Informationen in Zusammenhang mit der Abfrage der Browserversion am Ende des Kapitels in einem umfangreichen Beispiel einsetzen, um eine Schablone zu schaffen, die verschiedene Plattformen trennen und damit optimal bedienen kann.

Eigenschaften	Beschreibung
`availHeight`	Höhe des verfügbaren Bildschirms in Pixeln, d.h. minus Elementen, die den Bereich einschränken, wie die Taskbar in Windows.
`availLeft`	Angabe der X-Koordinate von dem ersten verfügbaren Pixel.
`availTop`	Angabe der Y-Koordinate von dem ersten verfügbaren Pixel.
`availWidth`	Breite des verfügbaren Bildschirms in Pixeln.
`colorDepth`	Die Bit-Tiefe der Farbpalette.
`height`	Bildschirmhöhe.
`pixelDepth`	Bildschirmfarbauflösung (Bits per Pixel).
`width`	Bildschirmbreite.

Tabelle 18.7: Eigenschaften von screen

String

String-Manipulationen gehören zu den wichtigsten Aktionen bei komplexeren Scripten. Das Objekt String ist deshalb eines der wichtigsten Objekte. Damit können Sie mit verschiedensten Methoden Zeichenketten manipulieren. Eine Instanz von String brauchen Sie nicht eigens erzeugen, da es sich um ein so genanntes »built in«-Objekt handelt. Eine Zuweisung der Form

var text="irgend ein Text";

erzeugt automatisch ein String-Objekt. Eine Verwendung des new- Schlüsselwortes in der Form

var text = new String("irgend ein Text");

funktioniert aber auch.

Eigenschaften hat das Objekt nur wenige (length zur Speicherung der Anzahl von Zeichen einer Zeichenkette sowie prototype und constructor). Dafür gibt es aber umso mehr Methoden.

Methoden

Methode	Beschreibung
`anchor(Ankname)`	Hiermit wird ein Verweisziel innerhalb einer HTML-Datei mit dem übergebenen Namen für den Anker erzeugt.
`big()`	Diese Methode setzt eine über String definierte Zeichenkette in den HTML-Container <big> und bewirkt eine größere Schrift.
`blink()`	Diese Methode setzt eine über String definierte Zeichenkette in den HTML-Container <blink> und bewirkt eine blinkende Schrift.
`bold()`	Diese Methode setzt eine über String definierte Zeichenkette in den HTML-Container <b> und bewirkt eine fette Schrift.
`charAt(Nummer)`	Die Methode liefert das Zeichen zurück, das in der Zeichenkette an der Stelle steht, die im Parameter Nummer übergeben wird.
`charCodeAt(Index)`	Gibt ein Zahl zurück, die dem Unicode-Wert des Zeichens an dem angegebenen Index entspricht.
`concat(String1, String2 [, ..., StringN])`	Verbindet zwei oder mehr Strings zu einem neuen.
`fixed()`	Diese Methode setzt eine über String definierte Zeichenkette in den HTML-Container <tt> und bewirkt eine dichtengleiche Schrift.
`fontcolor(Farbe)`	Diese Methode setzt eine über String definierte Zeichenkette in den HTML-Container <font color=[Farbe]> ... </font> und bewirkt eine andersfarbige Schrift. Die gewünschte Farbe wird der Funktion als Parameter übergeben, und zwar entweder in hexadezimaler Schreibweise oder als Farbname.
`fontsize(Zahl)`	Diese Methode setzt eine über String definierte Zeichenkette in den HTML-Container <font size=[Zahl]> ... </font> und bewirkt eine größere oder kleinere Schrift. Die gewünschte Größe wird der Funktion als Parameter übergeben. Es muss eine Zahl von 1 bis 7 sein. 1 ist sehr kleine Schrift, 3 ist Normalschrift, 7 ist sehr große Schrift.
`fromCharCode(num1, ..., numN)`	Gibt einen String zurück, der aus der angegebenen Sequenz aus Unicode-Werten erstellt wurde.
`indexOf(Zeichen, [Nummer])`	Hier wird das erste Vorkommen eines Zeichens oder einer Zeichenkette innerhalb der mit String spezifizierten Zeichenkette ermittelt. Die Rückgabe ist die Stelle, an der das Zeichen in der Zeichenkette steht. Die Zählung beginnt bei 0. Optional ist es möglich, die Funktion in einem zweiten Parameter [Nummer] anzuweisen, ab der wie vielten Stelle in der Zeichenkette sie mit der Suche beginnen soll. Wenn das gesuchte Zeichen nicht gefunden wurde, wird -1 zurückgegeben.
`italics()`	Diese Methode setzt eine über String definierte Zeichenkette in den HTML-Container <i> und bewirkt eine kursive Schrift.
`lastIndexOf( Zeichen, [Nummer])`	Hier wird das letzte Vorkommen eines Zeichens oder einer Zeichenkette innerhalb der mit String spezifizierten Zeichenkette ermittelt. Die Rückgabe ist die Stelle, an der das Zeichen in der Zeichenkette steht. Die Zählung beginnt bei 0. Optional ist es möglich, die Funktion in einem zweiten Parameter [Nummer] anzuweisen, ab der wie vielten Stelle in der Zeichenkette sie mit der Suche beginnen soll.
`link(Verweis)`	Die Methode erzeugt einen Verweis. Das Verweisziel, z.B. ein Dateiname oder eine URL-Adresse, wird als Parameter übergeben. Den Verweistext müssen Sie als Variable definieren.
`match(regExp)`	Die Methode wird dazu verwendet, um einen regulären Ausdruck mit einem String zu vergleichen.
`replace(was, womit)`	Die Methode ersetzt den zuerst angegebenen Ausdruck durch den zweiten Ausdruck.
`search(was)`	Die Methode durchsucht den String nach der als Parameter angegebenen Zeichenkette. Falls die Zeichenkette nicht gefunden wird, wird der Wert -1 zurückgeliefert, sonst ein davon verschiedener Wert.
`slice(Beginn[, Ende])`	Extrahiert einen Teilstring von dem angegebenen Index bis zum Ende oder einem optionalen Ende-Index. Dieser kann auch ein negativer Wert sein, wenn ab dem Ende des Strings rückwärts gezählt werden soll.
`small()`	Diese Methode setzt eine über String definierte Zeichenkette in den HTML-Container <small> und bewirkt dadurch eine kleinere Schrift.
`split([Separator][, Limit])`	Die Methode trennt einen String in ein Array von Teilstrings, indem an dem angegebenen Separator geteilt wird. Wird der Separator nicht vorgefunden oder er fehlt, wird ein Array mit einem Element und dem vollständigen String zurückgegeben. Das optionale Limit gibt eine maximale Anzahl von Trennungen an.
`strike()`	Diese Methode setzt eine über String definierte Zeichenkette in den HTML-Container <s> und bewirkt dadurch einen durchgestrichenen Text.
`sub()`	Diese Methode setzt eine über String definierte Zeichenkette in den HTML-Container <sub> und bewirkt eine tiefgestellte Schrift.
`substr(Start[, length])`	Gibt die Zeichen in einem String zurück, wobei bei dem angegebenen Index begonnen und bis zum Ende oder der optionalen Anzahl von Zeichen extrahiert wird.
`substring(Von, Bis)`	Liefert eine Zeichenkette zurück, die einen Teil innerhalb einer über String definiertee Zeichenkette darstellt. Als Parameter werden der Funktion der Beginn (Von) und das Ende (Bis) der zurückzugebenden Zeichenkette übergeben. Das erste Zeichen hat den Wert 0.
`sup()`	Diese Methode setzt eine über String definierte Zeichenkette in den HTML-Container <sup> und bewirkt dadurch eine kleinere Schrift.
`toLowerCase()`	Die Methode wandelt alle in der über String spezifizierten Zeichenkette enthaltenen Großbuchstaben in Kleinbuchstaben um.
`toUpperCase()`	Die Methode wandelt alle in der über String spezifizierten Zeichenkette enthaltenen Kleinbuchstaben in Großbuchstaben um.

Tabelle 18.8: Methoden von String

Daneben gibt es noch die allgemeinen Methoden toString(), toSource() und valueOf().

Wir wollen den Einsatz von String-Methoden mit mehreren Beispielen üben.

Beispiel 2:

Das Beispiel zeigt den Einsatz von den Methoden, welche HTML-Befehle nachbilden sowie die Konvertierung in Groß- und Kleinbuchstaben. Erstellen Sie die Datei String1.htm:

<HTML>
<SCRIPT language="JavaScript">
var meinText = "Das ist der Text aller Texte";
var vglText = "Dat is nur zum Vergleich da. ";
document.write(vglText + meinText.big());
document.write("<BR>");
document.write(vglText + meinText.blink());
document.write("<BR>");
document.write(vglText + meinText.bold());
document.write("<BR>");
document.write(vglText + meinText.fixed());
document.write("<BR>");
document.write(vglText + meinText.fontcolor("red"));
document.write("<BR>");
document.write(vglText + meinText.fontcolor("blue"));
document.write("<BR>");
document.write(vglText + meinText.fontcolor("green"));
document.write("<BR>");
document.write(vglText + meinText.fontsize(1));
document.write("<BR>");
document.write(vglText + meinText.fontsize(7));
document.write("<BR>");
document.write(vglText + meinText.fontsize(5));
document.write("<BR>");
document.write(vglText + meinText.italics());
document.write("<BR>");
document.write(vglText + meinText.small());
document.write("<BR>");
document.write(vglText + meinText.strike());
document.write("<BR>");
document.write(vglText + meinText.sub());
document.write("<BR>");
document.write(vglText + meinText.sup());
document.write("<BR>");
document.write(vglText + meinText.toLowerCase());
document.write("<BR>");
document.write(vglText + meinText.toUpperCase());
document.write("<BR>");
</SCRIPT>
<BODY>
</BODY>
</HTML>
 Abbildung 18.2:   Verschiedene Textformatierungen

Beispiel 3:

Das Beispiel zeigt den Einsatz von den Methoden, welche in Texten verschiedene Operationen ausführen. Erstellen Sie die Datei String2.htm:

<HTML>
<SCRIPT language="JavaScript">
var meinText = "Das ist der Text aller Texte";
var text1 = " Die ";
var text2 = "Antwort ";
var text3 = "ist ";
var text4 = "42";
document.write(meinText.charAt(2));
document.write("  ");
document.write(meinText.charAt(6));
document.write("  ");
document.write(meinText.charAt(8));
document.write("  ");
document.write(meinText.charAt(9));
document.write("<BR>");
document.write(meinText.charCodeAt(2));
document.write("  ");
document.write(meinText.charCodeAt(6));
document.write("  ");
document.write(meinText.charCodeAt(8));
document.write("  ");
document.write(meinText.charCodeAt(9));
document.write("<BR>");
document.write(
meinText.concat(text1,text2,text3,text4));
document.write("<BR>");
document.write(meinText.indexOf("i"));
document.write("<BR>");
document.write(meinText.search("aller"));
document.write("<BR>");
document.write(meinText.replace("aller", "welcher"));
document.write("<BR>");
document.write(meinText.lastIndexOf("e"));
document.write("<BR>");
</SCRIPT>
<BODY>
</BODY>
</HTML>
 Abbildung 18.3:   Verschiedene Operationen in Texten

Beispiel 4:

Das abschließende Beispiel zu diesem Thema zeigt wie das zweite Beispiel den Einsatz von den Methoden, welche in Texten verschiedene Operationen ausführen. Erstellen Sie die Datei String3.htm:

<HTML>
<SCRIPT language="JavaScript">
var meinText = "Der Wert der Zahl PI: 3.14.";
neuArray = meinText.match(/d/gi); 
document.write(neuArray); 
document.write("<BR>");
str=meinText.slice(3,-5);
document.write(str);
document.write("<BR>");
document.write("(1,2): ", meinText.substr(1,2))
document.write("<BR>");
document.write("(-2,2): ", meinText.substr(-2,2))
document.write("<BR>");
document.write("(1): ", meinText.substr(1))
document.write("<BR>");
document.write("(-10, 2): ", meinText.substr(1,10))
document.write("<BR>");
document.write("(10, 2): ", meinText.substr(10,2))
document.write("<BR>");
</SCRIPT>
<BODY>
</BODY>
</HTML>
 Abbildung 18.4:   Verschiedene Operationen in Texten

Das navigator-Objekt

Über das Top-Level-Objekt navigator hat man Zugriff auf den verwendeten Browser des Anwenders. Dies ist besonders dann wichtig, wenn Browser-spezifische Anweisungen verwendet werden (damit sind sowohl Script-Anweisungen - insbesondere die Verwendung von Mischkonstellationen - und sogar HTML oder Style Sheets gemeint). Eine Instanz von navigator braucht nie extra erzeugt werden, da es sich um ein »built in«-Objekt handelt.

Eigenschaften

Das Objekt hat die folgenden Eigenschaften:

Eigenschaft	Beschreibung
`appCodeName`	Codename eines Browsers.
`appName`	Der offizielle Anwendungsname eines Browsers. Der Unterschied zu appCodeName ist beispielsweise bei Netscape, dass dort Mozilla und hier der Name des Browsers - Netscape - zurückgegeben wird.
`appVersion`	Die Version und Betriebssystemplattform des Browsers.
`language`	Die vom Anwender eingestellte Sprache des Browsers in international üblichen Abkürzungen (etwa `de` für deutsch).
`mimeTypes`	Ein Array von allen MIME-Typen, die auf dem Client unterstützt werden.
`platform`	Betriebssystem des Anwenders.
`plugins`	Ein Array von allen PlugIns, die beim Client installiert sind.
`userAgent`	Die Daten des verwendeten Browsers, und zwar genau so, wie sie im HTTP-Protokoll an den aufgerufenen WWW-Server übermittelt werden (eine Kombination von den restlichen Infos).

Tabelle 18.9: Eigenschaften von navigator

Das Objekt navigator hat nur wenige Methoden. Bis auf javaEnabled(), mit der die Java-Fähigkeit (Java - nicht JavaScript) eines Browsers getestet werden kann (true) und plugins.refresh(), um neu installierte PlugIns verfügbar zu machen, sind sie auch nicht so wichtig.

Praktische Beispiele zum Einsatz von dem navigator-Objekt werden wir im letzten Abschnitt zur Trennung von Browser- und Plattformwelten sehen.

Das history-Objekt

Über das history-Objekt - ein direktes Unterobjekt von window - hat man Zugriff auf die zuvor geladenen Seiten im Browser des Anwenders. Maßgeblich ist dabei die Liste, wie sie in der History-Liste des Browsers gespeichert ist. Eine Instanz des Objektes history steht automatisch bereit und sämtliche Eigenschaften und Methoden lassen sich für nachfolgende Syntax direkt verwenden:

history.[Eigenschaft/Methode]

Das Objekt besitzt im Wesentlichen die Eigenschaft length, worüber die Anzahl der Einträge in der aktuellen History-Liste dokumentiert wird. Die anderen Eigenschaften

current, 
next

und

previous

(aktuelle Seite in der Historie, nächste und vorherige) funktionieren nicht auf allen Browsern. An Methoden steht die folgende Liste zur Verfügung:

Methode	Beschreibung
`back()`	Die Methode lädt die zuletzt besuchte WWW-Seite.
`forward()`	Die Methode macht die back()-Methode rückgängig, lädt also die gerade mit der back()-Methode verlassene Seite wieder.
`go(Anzahl)`	Die Methode lädt eine beliebige Seite der History-Liste. Bezugspunkt ist dabei die aktuelle Seite. Sie können die Anzahl mit Vorzeichen verwenden und damit sowohl zurückgehen als auch vorwärts, wenn Sie vorher zurückgegangen sind.

Tabelle 18.10: Methoden von history

Das location-Objekt

Das location-Objekt - ein weiteres direktes Unterobjekt von window - repräsentiert den kompletten URL, der mit einem window-Objekt verknüpft ist. Jede der Eigenschaften von dem location-Objekt steht für einen anderen Bestandteil des URL. Wenn man die allgemeine Struktur eines URL zugrunde legt, sieht er so aus:

protocol//host:port/pathname#hash?search

Etwa derart:

http://www.rjs.de:84/mainframe.htm#Anfang?x=7&y=2

Jeder der einzelnen Bestandteile des URL steht als Bezeichner einer Eigenschaft des location-Objekts zur Verfügung und kann direkt verwendet werden.

Eigenschaften

Eigenschaft	Beschreibung
`protocol`	Das den URL beginnende Protokoll inklusive des ersten Doppelpunkts.
`host`	Host- und Domainname, oder IP-Addresse.
`port`	Der Port.
`pathname`	Der Pfad inklusive Datei.
`hash`	Der Anker in der Webseite inklusive des Trennzeichens # (nur bei HTTP-URLs).
`search`	Suchabfragen inklusive dem Trennzeichen ? (nur bei HTTP-URLs). Der Suchstring besteht aus Variablen und Wertepaaren, jedes Paar durch & getrennt.
`href`	Die vollständige Repräsentation eines URL.
`hostname`	Die Repräsentation des kontaktierten Hosts samt Port.

Tabelle 18.11: Eigenschaften von location

Methoden

Methoden	Beschreibung
`reload()`	Erzwingt ein Reload von dem aktuell im Fenster angezeigten Dokument.
`replace()`	Lädt den angegebenen URL über den aktuellsten History-Eintrag.

Tabelle 18.12: Methoden von location.

Am wichtigsten an dem location-Objekt dürfte sein, dass man damit aus JavaScript heraus eine neue Seite in den Browser laden kann. Mit dem location-Objekt kann man auf folgende zwei Weise eine neue Webseite in den Browser laden:

window.location.href="http://www.rjs.de/"
window.location="http://www.rjs.de /"

Bei der Arbeit mit Event-Handlern sollte window.location dem einfachen Verwenden von location vorgezogen werden. Das Objekt location ist keine Eigenschaft des document-Objekts; dort gibt es ein Äquivalent document.URL.

Den praktischen Einsatz des location-Objekts werden wir bei der Trennung von Browsern sehen.

Trennung von Browser- und Plattformwelten

Wir haben nun alles an notwendigem Rüstzeug zusammen, um Browser und Plattformen per JavaScript zu identifizieren und entsprechend darauf zu reagieren. Reagieren soll bei uns bedeuten, es werden verschiedene Seiten je nach Clientvoraussetzung geladen oder ähnlich differenzierende Schritte unternommen (die Ausarbeitung sei hier außer Acht gelassen - das sind dann nur noch Details). Dabei wollen wir verschiedene Stufen durchspielen - von der Entscheidung, ob überhaupt JavaScript bereitsteht, über das einfache Aufteilen nach Internet Explorer und Netscape Navigator bis zum differenzierten Aufteilen nach Versionsnummer, Bildschirmeckdaten und Betriebssystem.

JavaScript-Test

Eine der grundlegenden Unterteilungen in Webprojekten ist die, dass erst Mal unterschieden wird, ob bei einem Client JavaScripte ausgeführt werden können oder nicht. JavaScript ist eine ideale Technik zum Trennen von Browser-Welten. Aber was ist, wenn JavaScript deaktiviert ist? Eine Abfrage per JavaScript, ob JavaScript aktiviert ist, ist ja nicht möglich. Oder doch? Es geht wirklich. Indirekt. Man nutzt die Tatsache, dass eine JavaScript-Aktion bei deaktiviertem JavaScript überhaupt nicht funktioniert. Wenn man auf einer Webseite eine automatische Weiterleitung per JavaScript durchführt (wir wollen dies in der Folge mit dem gerade beschriebenen Unterobjekt von window machen - location), wird diese bei deaktiviertem JavaScript nicht ausgeführt und die Seite bleibt stehen. Wenn ein zusätzlicher HTML-<META>-Tag, der nach einem Zeitintervall (unbedingt länger als das Weiterleitungsintervall des JavaScripts) automatisch auf ein Teilprojekt ohne JavaScript weiterleitet, trennt die Welten.

Beispiel 5:

Erstellen Sie die nachfolgende Datei Trennung1.htm und nachfolgende die beiden Dateien OhneJS.htm und MitJS.htm, die einfach nur eine kurze Begrüßung oder so enthalten sollen (das ist nicht wesentlich):

<HTML>
<HEAD>
<META http-equiv="refresh" content="8;URL=OhneJS.htm">
</HEAD>
<SCRIPT LANGUAGE="JavaScript">
function JSweiter() {
location.href="MitJS1.htm";
}
function JSoderNicht() {
window.setTimeout('JSweiter()',1000);
}
</SCRIPT> 
<BODY onLoad="JSoderNicht()">
</BODY>
</HTML>
 Abbildung 18.5:   Schnelle Weiterleitung per JavaScript

Automatische Trennung von Netscape- und Microsoft- Browsern

Um die beiden Browser-Welten bzw. ihr globales Eventhandling zu trennen, kann man bei aktiviertem JavaScript im Browser auf verschiedene Varianten zurückgreifen. Es gibt einmal die einfachste Version, in der ein ähnliches Prinzip wie in dem Fall von deaktiviertem JavaScript verwendet wird. Man bedient sich einer Anweisung, die jeweils von der nicht gewünschten Browservariante nicht verstanden wird, und wertet die Reaktion aus. Etwa wie im Beispiel mit einer if-Struktur. Der Zugriff auf das jeweilige Objekt liefert nur dann den Wert wahr, wenn es auch unterstützt wird. Dabei benutzt man zur Identifizierung des Internet Explorer das Objekt all, das nur von diesem unterstützt wird, und zur Identifizierung des Navigator das Objekt layers, das nur dieser versteht.

Beispiel 6:

Erstellen Sie die nachfolgende Datei Trennung2.htm und danach die beiden Dateien IE1.htm und NC1.htm, die wieder nur eine kurze Grußbotschaft oder so zu enthalten brauchen:

<HTML>
<SCRIPT LANGUAGE="JavaScript">
function BrowserTrennen() 
{
if (document.all)
{
location.href="IE1.htm";
}
if (document.layers)
{
location.href="NS1.htm";
}
}
</SCRIPT> 
<BODY onload="BrowserTrennen()">
</BODY>
</HTML>
 Abbildung 18.6:   In die Netscape-Welt weitergeleitet

So elegant und zuverlässig dieser Trick ist - er nutzt jeweils einen Mangel des unerwünschten Browsers aus. Wenn irgendwann dieser jeweilige Mangel beseitigt wird, wird die Überprüfung nicht mehr greifen. Eine andere Variante trennt die beiden Browser einfach über explizite Abfrage des jeweiligen Browsers mittels des navigator-Objekts und dessen Eigenschaft appName.

Beispiel 7:

Erstellen Sie die nachfolgende Datei Trennung3.htm:

<HTML>
<SCRIPT LANGUAGE="JavaScript">
function BrowserTrennen() 
{
if(navigator.appName == "Netscape") 
{
location.href="NC1.htm";
}
if(navigator.appName == "Microsoft Internet Explorer") 
{
location.href="IE1.htm";
}
}
</SCRIPT> 
<BODY onload="BrowserTrennen()">
</BODY>
</HTML>
 Abbildung 18.7:   Willkommen in der Microsoftwelt

Die explizite Abfrage des jeweiligen Browsers mittels des navigator- Objektes und dessen Eigenschaft appName auf diese Art ist die meistgenutzte Variante, um einfach nur beide Browser-Welten zu trennen - selbst von vielen professionellen Seiten. Leider wird die Eigenschaft appName von einigen Partnerfirmen der Browserhersteller gelegentlich für Werbezwecke missbraucht. So liefert beispielsweise T-Online den Netscape Navigator mit einer veränderten appName-Eigenschaft aus, weshalb eine Abprüfung auf Gleichheit mit "Netscape" durch Scripte false liefern kann, obwohl der Browser ursprünglich diesen Wert in der Eigenschaft gesetzt hatte.

Um diesem Mangel zu begegnen, darf man nicht einfach nur auf Gleichheit prüfen, sondern darauf, ob eine bestimmte Zeichenkette im Wert der Eigenschaft enthalten ist (das ist selbst bei veränderter appName-Eigenschaft so gut wie immer noch der Fall). Dabei helfen die Methoden des String- Objekts. Etwa indexOf(), die wir gleich noch einsetzen, oder search(), womit in dem String nach dem Vorkommen der Zeichenkette gesucht wird und nicht unbedingte Gleichheit notwendig ist. Aber auch einige andere der Methoden des String-Objekts sind da ganz nützlich.

Beispiel 8:

Erstellen Sie die nachfolgende Datei Trennung4.htm:

<HTML>
<SCRIPT LANGUAGE="JavaScript">
var browser=navigator.appName;
function BrowserTrennen() 
{
if(browser.search("Netscape")==-1) 
{
location.href="IE1.htm";
}
else 
{
location.href="NS1.htm";
}
}
</SCRIPT> 
<BODY onload="BrowserTrennen()">
</BODY>
</HTML>

Im Vergleich wird der Wert -1 zurückgegeben, wenn die Zeichenkette nicht vorkommt. So funktioniert das Verfahren viel zuverlässiger. Wenn die Zeichenkette Netscape vorkommt, wird der else-Zweig ausgewählt, falls die Bedingung erfüllt ist, der if-Zweig.

Beispiel 9:

Das nächste Beispiel trennt mehr Bedingungen. Dabei sollen zwei Betriebssysteme (Mac und PC), Browsertypen, Browserversionen und die Bildschirmauflösung eine Rolle spielen. Das Beispiel ist nur für den Fall des Navigator auf PC-Ebene zu Ende notiert, aber die restlichen Fälle sind vollkommen identisch. Das Beispiel verwendet den ?:-Operator und noch ein paar JavaScript-Feinheiten, die Sie aber kennen sollten (Trennen5.htm):

<HTML>
<SCRIPT LANGUAGE="JavaScript">
function BrowserTrennen() 
{
var plattform = navigator.appVersion.indexOf('Mac') != -1 ? "mac" : "pc";
var browser = navigator.appName.indexOf('Netscape');
var browsver = parseInt(navigator.appVersion);
var bildschirmHoehe = screen.height;
if(plattform=="pc")
{
 if(browser!=-1) // Netscape
 {
    switch(browsver)
      {
      case 2:
    switch(bildschirmHoehe)
     {
    case 480:
    alert("Hallo PC NC 2 mit 480 Hoehe");
    break;
    case 600:
    alert("Hallo PC NC 2 mit 600 Hoehe");
    break;
    case 768:
    alert("Hallo PC NC 2 mit 768 Hoehe");
    break;
    default: 
    alert("Hallo PC NC 2 mit grosser Hoehe");
    break;
    }
    break;
      case 3:
    switch(bildschirmHoehe)
     {
    case 480:
    alert("Hallo PC NC 3 mit 480 Hoehe");
    break;
    case 600:
    alert("Hallo PC NC 3 mit 600 Hoehe");
    break;
    case 768:
    alert("Hallo PC NC 3 mit 768 Hoehe");
    break;
    default: 
    alert("Hallo PC NC 3 mit grosser Hoehe");
    break;
    }
    break;
      case 4:
    switch(bildschirmHoehe)
     {
    case 480:
    alert("Hallo PC NC 4 mit 480 Hoehe");
    break;
    case 600:
    alert("Hallo PC NC 4 mit 600 Hoehe");
    break;
    case 768:
    alert("Hallo PC NC 4 mit 768 Hoehe");
    break;
    default: 
    alert("Hallo PC NC 4 mit grosser Hoehe");
    break;
    }
    break;

  default:
    switch(bildschirmHoehe)
     {
    case 480:
    alert("Hallo PC NC 2 mit 480 Hoehe");
    break;
    case 600:
    alert("Hallo PC NC 2 mit 600 Hoehe");
    break;
    case 768:
    alert("Hallo PC NC 2 mit 768 Hoehe");
    break;
    default: 
    alert("Hallo PC NC 2 mit grosser Hoehe");
    break;
    }
    break;

  }
 }
 else  // IE
 {
   // analog
 }
}
else
{
// analog
}
}
</SCRIPT> 
<BODY onLoad="BrowserTrennen()">
</BODY>
</HTML>
 Abbildung 18.8:   Differenzierte Trennung

Beispiel 10:

Beide bisher genannten Varianten trennen die beiden Browser-Welten strikt. Oft ist das jedoch nicht unbedingt notwendig. Teile der beiden Welten sind gut kompatibel und man möchte vielleicht diese gemeinsam behandeln. Was jedoch unbedingt getrennt werden muss ist das globale Eventhandling über die jeweils inkompatiblen event-Objekte. So ganz trivial ist dies nicht, da bei der Microsoft-Variante des globalen Eventhandlings bereits im <SCRIPT>-Tag Attribute gesetzt werden müssen. Die Trennung von den Ereignisbehandlungsmodellen kann mit einem kleinen Trick erfolgen. Eine dritte Variante zur automatischen Trennung des Eventhandlings von Browsern (ohne den Rest der Seite auseinander zu dividieren) beruht darauf, dass man zwei getrennte <SCRIPT>-Container benutzt. Der erste <SCRIPT>-Container wird von jedem Browser geladen, verstanden und ausgeführt. Es handelt sich um einfachste JavaScript- Anweisungen. Wenn Sie an dieser Stelle bereits ältere Browserversionen abhalten wollen, können Sie auf language="JavaScript1.2" oder höher abfragen (sinnvoll). Im ersten <SCRIPT>-Container wird dann über eine if- Schleife abgefragt, ob explizit ein Netscape-Browser verwendet wird. Andere Browser werden den in der Schleife enthaltenen Code ignorieren und deshalb keine Probleme bereiten.

Die zweite <SCRIPT>-Container verwendet die spezielle Microsoft- Terminologie für das JavaScript-Eventhandling, aber dies ist auch für Netscape-Browser kein Problem. Die unbekannten Attribute werden einfach ignoriert, und es kommt normalerweise zu keinem Fehler. Die das zweite Script vollkommen ausfüllende if-Schleife hält den Netscape- Browser von den Anweisungen des Explorer ab und so werden Netscape- Browser damit keine Probleme bekommen. Erstellen Sie die Datei Trennen6.htm:

<HTML>
<HEAD>
<SCRIPT language="JavaScript">
<!--
var browser=navigator.appName;
if(browser.search("Netscape")!=-1) 
{
alert("Netscape");
}
//-->
</SCRIPT>
<SCRIPT FOR=document EVENT=onclick language="JavaScript">
<!--
if(browser.search("Netscape")==-1) 
{
alert("Microsoft");
}
-->
</SCRIPT>
<BODY>
</BODY>
</HTML>

Laden Sie die Datei. Im Internet Explorer tut sich nur etwas, wenn Sie in die Webseite klicken.

Zusammenfassung

Wir haben heute eine ganze Anzahl von Objekten kennen gelernt, auf die man mit JavaScript zugreifen kann. An erster Stelle sind dabei navigator und String zu nennen, aber auch Array, Date und Math sind sehr wichtig. Das Objekt Number wird Ihnen wahrscheinlich ebenso gelegentlich über den Weg laufen, während die restlichen Objekte sehr spezialisierte Anwendungen erlauben und in »Otto-Normal-Scripten« nicht so oft vorkommen werden.

Insbesondere haben wir mittlerweile genügend JavaScript-Techniken parat, um Browser und Plattformen per JavaScript zu identifizieren und entsprechend darauf reagieren zu können.

Fragen und Antworten

Frage:
Wie weit muss die Trennung von Browser- und Plattformwelten in der Praxis gehen?

Antwort:
Grundsätzlich sollte man die Browsertypen trennen, wenn man Style Sheets einsetzt oder globales Event-Handling betreiben möchte. Aber auch andere Indikatoren sprechen für eine Trennung der Browsertypen. Dazu ist die Abfrage, ob JavaScript aktiviert ist oder nicht, eigentlich eine Selbstverständlichkeit, wenn wesentliche Aspekte des Webprojekts davon abhängen. Wenn kein JavaScript aktiviert ist, kann man auch viele Rückschlüsse über die Verwendungsmöglichkeit von anderen Techniken ziehen. Entweder liegt ein ganz alter Browser vor - dann gehen weder Tabellen noch Frames, Java-Applets oder viele neue Multimedia-Erweiterungen. Oder der Anwender hat JavaScript nur deaktiviert. Dann kann man aber beim Anwender eine gewisse Feindlichkeit gegen so einen »Firlefanz« annehmen. Es ist in jedem Fall nicht unwahrscheinlich, dass dann auch Grafiken und alles, was sich sonst noch ausschalten lässt, deaktiviert ist. Ob man noch weiter differenzieren muss, kann bezweifelt werden. Besser ist es, wenn man auf Techniken verzichtet, die eine größere Zielgruppe ausschließen.

Frage:
Ist so eine differenzierte Aufteilung wie in Beispiel 9 überhaupt in der Praxis zu finden?

Antwort:
Ja. Sogar noch abgestufter. Etwa ob Flash-Formate verstanden werden, welche Farbtiefe vorhanden ist, welche PlugIns usw. Man findet so etwas oft dann, wenn Animationen auf der Webseite vorhanden sind, die auf Style Sheets, Bildgrößen und Positionierungen abgestimmt sind.

Workshop

Testen Sie das Math- und das Date-Objekt mit verschiedenen Beispielen. Dies ist ja in dem Kapitel nicht explizit gemacht worden. Nehmen Sie sich auch nochmals Arrays vor und wenden Sie einige der besprochenen Methoden an.

Erstellen Sie ein Script, das die Java-Fähigkeit eines Browsers abfragt.

Wenn Sie viel Zeit und Lust haben - vervollständigen Sie Beispiel 9.

Kontrollfragen

Im Anhang »Antworten zu den Kontrollfragen« finden Sie die Antworten zu den jeweils am Ende einer Lektion notierten Fragen.

Für was steht NaN?
Was ist das Problem an folgendem Vergleich?
```
if(navigator.appName == "Netscape")
```
Was macht getDate()?

Geht das?

berechne = new Function("a","b","return a * b + 5");

Was macht random() und zu welchem Objekt gehört die Methode?
Für was steht NEGATIVE_INFINITY?
Für was steht availLeft und zu welchem Objekt gehört es?
Was macht slice() und zu welchem Objekt gehört die Methode?

Viele Objekte können im Rahmen dieses JavaScript-Lehrgangs nur angerissen werden, aber wenn ein Objekt den Rahmen wirklich sprengt, dann dieses.