JavaScript Array Beispiel 3: Nachbildung assoziativer Arrays

JavaScript unterstützt – anders als andere Programmiersprachen – vom Grundsatz her keine assoziativen Arrays. Assoziative Arrays sind Arrays, bei denen der Zugriff auf die einzelnen Array-Elemente über einen Schlüssel erfolgt. Dieser Schlüssel wird in Form eines Strings angegeben, der im Allgemeinen eine Eigenschaft bezeichnet, deren Wert an dieser Stelle im Array gespeichert ist. Allerdings erlaubt JavaScript bei Array-Operationen, wie zuvor erwähnt, nur den Zugriff über den Array-Index. Mit Hilfe des JavaScript-Objekts Object kann dieses Manko behoben werden.

Object ist ein allgemeines Objekt, welches zur Speicherung von Eigenschaften genutzt werden kann. Die Eigenschaften werden unter einem individuellen Schlüssel gespeichert. Der Zugriff auf die Eigenschaften eines solchen Objekts erfolgt dann mit Hilfe des Punkt-Operators in der Form objektname.eigenschaft, wobei eigenschaft der Schlüssel ist, unter dem auf den entsprechenden Wert zugegriffen werden kann. Zulässige Schlüssel müssen bei dieser Form der Definition von Eigenschaften mit einem Unterstreichungszeichen oder einem Buchstaben beginnen und dürfen Buchstaben, Ziffern sowie Unterstreichungszeichen enthalten. Es gibt aber auch die Möglichkeit mit dem Vektor-Operator ([]) auf die Eigenschaften eines Objekts vom Typ Object zuzugreifen, wodurch ein assoziativer Zugriff realisiert werden kann. Insofern kann man Instanzen des Objekts Object bereits als eindimensionale assoziative Arrays sehen. Erfolgt die Initialisierung der Eigenschaften eines Objekts durch Nutzung des Vektor-Operators, so sind beliebige Zeichenketten als Schlüssel möglich.

Anders als ein normales Array ist ein über das Object-Objekt nachgebildetes assoziatives Array nicht mit der Array-Eigenschaft length ausgestattet. Das bedeutet, dass der Zugriff auf die einzelnen Elemente eines solchen Arrays nicht über den üblichen Array-Index erfolgen kann, sondern ausschließlich über die Schlüssel des Objekts. Auch die in einem Array-Objekt enthaltenen Methoden sind nicht verfügbar. Die in einem Object gespeicherten Eigenschaften – bzw. deren Schlüssel – lassen sich aber durch Nutzung der for-in-Schleife ermitteln. Durch Zählen der enthaltenen Schlüssel läßt sich das Problem mit der fehlenden length-Eigenschaft beheben.

Im Beispiel unten wird die Definition sowie der Zugriff auf die Elemente eines assoziativen Arrays mit Hilfe von Object-Objekten demonstriert. Als erstes wird eine Array-Variable mit dem Namen inventar definiert, die durch ein leeres Array initialisiert wird. Dann wird an Index-Position 0 ein Object-Objekt eingefügt, welches in Folge mit Werten für die Schlüssel „Artikel” und „Preis” initialisiert wird. Die beiden darauf folgenden Array-Elemente werden ebenfalls mit Schlüssel-Werte-Paaren gefüllt.

Nun geht es an die Ausgabe der Daten. Zunächst wird die Variable nkeys, welche der Speicherung der Anzahl der Schlüssel-Werte-Paare dient, definiert und mit 0 initialisiert. In der darauf folgenden for-in-Schleife wird jeder enthaltene Schlüssel per document.write ausgegeben und die Anzahl der gefundenen Schlüssel hochgezählt. Die Variable attr wird durch die for-in-Schleife bei jedem Durchgang mit dem aktuellen Schlüssel-String gefüllt. Dabei wird nur das erste Element des Arrays inventar (inventar[0]) genutzt (die anderen Elemente haben die gleiche Struktur). Danach wird die ermittelte Anzahl der gefundenen Schlüssel ausgegeben.

Der letzte Abschnitt des JavaScript-Codes dient der Ausgabe der Inhalte des assoziativen Arrays. Hier wird mit der ersten for-Schleife jedes im Array inventar enthaltene Element nacheinander verarbeitet. Da inventar ein normales Array ist, kann hier auf die Array-Eigenschaft length zurückgegriffen werden um die Anzahl der enthaltenen Elemente zu ermitteln. Die innere for-in-Schleife greift auf Objekte des Typs Object zu (inventar[i] enthält Instanzen vom Typ Object), so dass hier der Zugriff über die enthaltenen Eigenschaften (Schlüssel) erfolgen muss. Es wird also jeweils der Inhalte inventar[i]['Artikel'] gefolgt von inventar[i]['Preis'] ausgegeben. Nach der Ausgabe eines jeden Elements von inventar (Object-Instanz mit enthaltenen Eigenschaften Artikel und Preis) wird ein Zeilenumbruch ausgegeben.

<script language="javascript" type="text/javascript">
<!-- // JavaScript-Bereich für ältere Browser auskommentieren
// Variable mit einem leeren Array erzeugen
var inventar = new Array ();

// Neue Instanz eines Object-Objekts erzeugen und an erster
// Stelle im Array speichern
inventar[0] = new Object ();
// In der zweiten Dimension wird jetzt ein Schlüssel für assoziativen
// Zugriff vergeben und der entsprechende Wert zugewiesen
inventar[0]['Artikel'] = 'Maus';
inventar[0]['Preis'] = '9,99';

// Weitere Datensätze mit entsprechenden Schlüsseln initialisieren
inventar[1] = new Object ();
inventar[1]['Artikel'] = 'Monitor';
inventar[1]['Preis'] = '199,-';
inventar[2] = new Object ();
inventar[2]['Artikel'] = 'Rechner';
inventar[2]['Preis'] = '498,-';

// zur Speicherung der Anzahl der enthaltenen Schlüssel
nkeys = 0;
// Im Objekt vergebene Schlüssel ausgeben und Schlüssel zählen
document.write ('Enthaltene Schl&uuml;ssel: ');
// Die enthaltenen Schlüssel werden mit der for-in-Schleife ermittelt
// und in der Variable attr zwischengespeichert
for (var attr in inventar[0]) {
  document.write (attr + ' ');
  nkeys++;
}
// Anzahl der enthaltenen Schlüssel ausgeben
document.write ('<br>Anzahl der Schl&uuml;ssel (entspricht Array.length): ' + nkeys + '<br>');

document.write ('Inhalt des assoziativen Arrays:<br>');
// Zugriff auf length ist möglich, da inventar ein einfaches Array ist
for (i = 0; i < inventar.length; i++) {
  // Bei Zugriff auf Objekte existiert kein length
  for (var attr in inventar[i])
    // Inhalt des unter den Schlüsseln gespeicherten
    // Elements ausgeben
    document.write (inventar[i][attr] + ' ');
  // Zeilenumbruch ausgeben
  document.write ('<br>');
}
// -->
</script>

Letzte Posts aus unserem Forum

Probleme mit iphone

Hallo, ich habe ein Problem bei der Darstellung einer Webseite. In allen Browsern hat das bisher bestens funktioniert außer beim iPhone und iPad, wo ... » mehr

von Finlay am Dienstag, 10. Juli 2012 19:45 in JavaScript - noch nicht beantwortet

Stream musik

Hallo, ich bin auf der Suche nach einem Script, mit dem ich einen Leser für Audio-Spuren in eine Html-Webseite einfügen kann. Ich brauche dabei ... » mehr

von Finlay am Sonntag, 22. Januar 2012 22:52 in JavaScript - bisher 2 Antworten
Letzter Beitrag: Dienstag, 8. Mai 2012 16:04 von maharadja

ich habe das mal mit jplayer probiert und bei mir gings ... » mehr

Byte Array PDF im Browser anzeigen

Hallo, ich bekomme von einem Webservice ein PDF als Byte Array. Mit einem JsonP Request habe ich das Byte Array so wie es ist (als Array von Bytes) ... » mehr

von TiloS am Mittwoch, 11. April 2012 17:37 in JavaScript - noch nicht beantwortet

Überbelnd effect in javascript gallerie

ich habe hier einie gallerie die funktioniert problem los aber hat noch kein über belnd effect jedoch würde ich diesen gerne einfügen aber ich habe ... » mehr

von faebe am Freitag, 20. Januar 2012 20:19 in JavaScript - noch nicht beantwortet

XML per JavaScript verarbeiten - IE

Hallo! Vielen Dank für das super kommentierte Script-Beispiel zur Weiterverarbeitung von XML-Dateien per JavaScript: ... » mehr

von gn0me am Freitag, 11. März 2011 19:03 in JavaScript - noch nicht beantwortet


¬ Insolvenzrecht