Zum Inhalt

Inhaltsverzeichnis • Teil 5 - JavaScript • Ablauf • Objekte
⇦ Funktionen / Zuweisungen und Ausdrücke ⇨
23.07.2014 19:55:00

Objekte

Eigene Objekte

Im Definitionsbereich haben wir schon eigene Objekte definiert. Nun wollen wir mit Objekten arbeiten.

Beispiel:

function Benutzer(vn,nn) {
  // Attribute
  this.Vorname = vn;
  this.Nachname = nn;
  this.Name = BenutzerName;
}
// Methoden
function BenutzerName() {
  return (this.Vorname + " " + this.Nachname);
}

var Nutzer1 = new Benutzer("Christian","Hartnick");
var Nutzer2 = new Benutzer("Max","Mustermann");

Anmerkung: Das Schlüsselwort this ist immer eine Referenz auf das aktuelle Objekt. Das funktioniert zum Beispiel auch im HTML-Quelltext bei „on“-Ereignissen: <input type="button" value="OK" onclick="alert( this.form.Feld.value )">.

Eigenschaften: Attribute und Methoden

Der Zugriff auf Attribute und Methoden geschieht über den .-Operator bei Attributen

Nutzer2.Vorname = "Petra";

und Methoden

alert (Nutzer1.Name() + ", " + Nutzer2.Name());

, also im Endeffekt wie bei einer Variable und bei einer Funktion.

Beispielskript ausführen

with

Zur Vereinfachung kann man Objektebezeichner auch mit dem Schlüsselwort with voraussetzen:

with (Nutzer2) {
  Vorname = "Petra";
  Nachname = "Musterfrau";
  alert (Name());
}

Vordefinierte Objekte

Die große Stärke von JS ist die hohe Anzahl vordefinierter Objektklassen. Diese können sie wie eine eingebaute Funktionsbibliothek einfach benutzen. Innerhalb dieser Objekte müssen wir zwischen JS-Objekten und Browser-Objekten unterscheiden.

s. Anhang: JS-Funktionen und Objekte

von JS

JS-Objekte stellen so etwas wie eine Bibliothek von Basisfunktionen dar. Sie haben mit ihnen Zugriff auf mathematische Funktionen und Datumsfunktionen. Außerdem haben alle Datentypen (Zahlen (Number), Zeichenketten (String), Wahrheitswerte (Boolean)) eigene Klassen. Außerdem gibt es eine Klasse für Reguläre Ausdrücke, die wir hier allerdings nicht besprechen.

Das Datumsobjekt (Date) besitzt beispielsweise die Methoden:

getDate()
Holt das aktuelle Datum samt Uhrzeit als Zahlenwert
toLocaleString()
Wandelt einen Datum/Uhrzeit-Wert in einen menschlich lesbaren um
Editor - index.html
<script type="text/javascript">
var Datum = new Date();
with (Datum) {
  alert(toLocaleString(getDate()));
}
</script>

Beispielskript ausführen

des Browser

Auch der Browser stellt viele Objekte bereit (damit sind sie aber auch abhängig von dem Browser und der Browserversion). Diese Objekte werden aus dem HTML-Quelltext und der Browserkonfiguration dynamisch erzeugt.

Auf diese Objekte werden wir im Kapitel DOM genauer eingehen.

Editor - index.html
<script type="text/javascript">
var Liste = new Array();
for (var Element in window) {
  Liste.push ( "(" + typeof (window[Element]) + ") " + Element + "\n");
}
alert(Liste.sort().join(""));
</script>

Beispielskript ausführen

Assoziatives Array

Bei assoziativen Arrays erfolgt der Zugriff auf einzelne Elemente mit einer Zeichenkette. Im Gegensatz zu anderen Programmiersprachen gibt es in JavaScript keine assoziativen Arrays. Man kann jedoch mit Objekten ein assoziatives Arrays grundlegend nachbauen.

Alternativ zum .-Operator funktioniert auch der Index-Operator (objekt["attribut"]) bei Objekten. So lassen sich über Attribute beliebige Schlüssel erzeugen.

Anmerkung: Ein solches "unechtes" assoziatives Array besitzt nicht die gewöhnlichen Methoden und Eigenschaften eines Arrays. So können sie nicht über length() die Anzahl der Elemente zu ermitteln. Die Elemente eines solchen „Arrays“ können sie nur über den Namen oder über eine for-in-Schleife ansprechen.

Zusammenfassung

⇦ Funktionen / Zuweisungen und Ausdrücke ⇨
Nach oben