JavaScript Array Objekt

Das Objekt Array ist ein unter JavaScript vordefinierter Container-Typ – dieser Container-Typ wird auch Vektor genannt – zur Speicherung von Daten gleichen Typs, die unter einer Variable gespeichert werden. Obwohl Arrays im Normalfall mit Elementen gleichen Datentyps gefüllt werden, ist es unter JavaScript dennoch möglich Elemente unterschiedlichen Datentyps in Arrays zu speichern. Der Zugriff auf die einzelnen Datensätze des Arrays erfolgt grundsätzlich über den Array-Index. Das erste Element hat dabei den Index 0 und das Letzte den Index n-1, wobei n die Anzahl der Elemente ist, für die bei der aktuellen Dimensionierung im Array Platz reserviert ist – dies bedeutet nicht, dass auch alle Speicherplätze belegt sind.

Über die Array-Eigenschaft length läßt sich die Anzahl der Elemente ermitteln, die im entsprechenden Array Platz finden. Wird lesend auf einen nicht existierenden Index zugegriffen, so liefert JavaScript „undefined”. Beim Schreibenden Zugriff auf einen nicht existierenden Index wird das Array bis zu diesem Index mit leeren Speicherplätzen gefüllt und der entsprechende Wert an der gewünschten Stelle angehängt. Siehe auch Array in PHP.

JavaScript Array Beispiel 1: Initialisierung von Arrays

Zur Initialisierung von Arrays stehen drei verschiedene Möglichkeiten zur Verfügung. Im unteren Beispiel wird zunächst ein Array unbekannten Ausmaßes definiert. Es steht hier noch nicht fest, wieviele Elemente zu einem späternen Zeitpunkt im Array gespeichert werden sollen. Der Default-Constructor von Array – wird immer dann aufgerufen wenn keine Parameter an den Constructor übergeben werden – erzeugt eine Array-Instanz, in der vorerst kein Speicherplatz für Elemente reserviert ist. Dann wird mit write die Anzahl der Elemente ausgegeben, für die im Array Speicherplatz reserviert wurde. Wir erinnern uns: Jede Instanz eines Array-Objekts speichert in der length-Eigenschaft die Anzahl von Elementen, die im jeweiligen Array Platz finden.

Mit dem darauf folgenden Zugriff auf das 101. Element des Arrays (Index beginnt bei 0) wird auf ein nicht existierendes Element zugegriffen und der Zugriff liefert wie erwartet „undefined”. Nach Zuweisung des Wertes 1 auf das Element mit dem Index 100 (101. Element) liefert die Ausgabe des Elements nun den zuvor zugewiesenen Wert. Auch die Größe des Arrays hat sich nun erwartungsgemäß auf 101 Elemente geändert, da die vor dem zugewiesenen Element gelegenen Elemente mit dem Defaultwert „undefined” aufgefüllt wurden.

Mit den Array-Methoden push und pop können aber auch zu einem späteren Zeitpunkt weitere Array-Elemente hinzugefügt bzw. aus dem Array entfernt werden. Somit ist eine dynamische Anpassung der Array-Größe jederzeit möglich.

<script language="javascript" type="text/javascript">
<!-- // JavaScript-Bereich für ältere Browser auskommentieren
// Die Anzahl der Elemente steht noch nicht fest
var ungewiss = new Array ();
// Anzahl der Elemente im Array ausgeben
document.write ('Elemente in Array ungewiss: ' + ungewiss.length + '<br>');
// lesender Zugriff auf nicht existierendes Element
document.write ('ungewiss[100]: ' + ungewiss[100] + '<br>');
// schreibender Zugriff auf noch nicht existierendes Element
ungewiss[100] = 1;
// Ausgabe des zuletzt zugewiesenen Elements
document.write ('ungewiss[100]: ' + ungewiss[100] + '<br>');
// Anzahl der Elemente im Array ausgeben
document.write ('Elemente in Array ungewiss: ' + ungewiss.length);
// -->
</script>

Die zweite Variante zur Initialisierung von JavaScript-Arrays wird im folgenden Script-Abschnitt vorgeführt. Der Constructor wird in diesem Fall mit einer ganzen, positiven Zahl – der Anzahl der zu erzeugenden Elemente – als Parameter aufgerufen. Dies veranlasst, dass das Array mit der übergebenen Anzahl von Speicherplätzen für Array-Elemente initialisiert wird. Hier wird das Array mit einer initialen Größe von drei Elementen erzeugt. Alle darin enthaltenen Elemente werden zunächst leer erzeugt das heißt, dass nur der Platz zur Speicherung der Elemente reserviert wird, die Elemente selbst aber nicht initialisiert werden. Da der Typ der zu speichernden Elemente noch nicht fest steht ist dies auch nicht möglich. Nicht initialisierte Elemente im Array liefern „undefined”, wenn lesend auf sie zugegriffen wird.

In Folge werden die ersten beiden Elemente mit Werten gefüllt. Das erste der beiden Elemente erhält einen Wert vom Typ number (den Wert 1) und das zweite Element wird mit einem String (der Zeichenkette „Hundekuchen”) initialisiert. Dem dritten Element wird kein Wert zugewiesen. Danach folgt die Ausgabe der Elemente, die sich im Array befinden. Zugegriffen wird, wie bei JavaScript-Arrays üblich, über den Array-Index. Neben den eigentlichen Werten der Elemente des Arrays werden auch die Datentypen der einzelnen Elemente ausgegeben. Ermittelt wird der Datentyp einer Variablen durch den Operator typeof, der für jede der im Array gespeicherten Variablen den Datentyp ermittelt und seine Bezeichnung als String zurück liefert. Die letzte Ausgabe dieses Script-Abschnitts gibt widerum die Anzahl der im Array befindlichen Elemente aus.

<script language="javascript" type="text/javascript">
<!-- // JavaScript-Bereich für ältere Browser auskommentieren
// Es sind 3 Elemente vorgesehen, die noch hinzugefügt werden müssen.
var gewiss = new Array (3);
// Elemente initialisieren
gewiss[0] = 1;
gewiss[1] = 'Hundekuchen';
// Inhalt des Arrays und die Datentypen der einzelnen Elemente ausgeben
document.write ('Inhalt von gewiss:');
for (i = 0; i < gewiss.length; i++)
  document.write ('<br>&nbsp;gewiss[' + i + ']: ' + gewiss[i] + ', Datentyp: ' + typeof (gewiss[i]));
// Anzahl der Elemente im Array ausgeben
document.write ('<br>Elemente in Array gewiss: ' + gewiss.length);
// -->
</script>

Die letzte Möglichkeit der Initialisierung eines Arrays wird mit der Definition der Array-Variablen pizza demonstriert. Hier wird eine Array-Variable mit dem Namen pizza definiert, die zugleich mit den initialen Werten gefüllt wird. Bei dieser Art der Initialisierung werden die Werte, mit denen das Array gefüllt werden soll direkt an den Constructor übergeben. Die einzelnen Werte haben einen beliebigen Datentyp und werden durch Kommata voneinander getrennt. Es werden hier also fünf Elemente des Datentyps String (die aufgeführten Pizzasorten) als Elemente des Arrays zugewiesen. Dies hat natürlich zur Folge, dass sich nach der Initialisierung fünf Elemente (mit den Index-Werten 0 bis 4), alle vom Datentyp String, im Array pizza befinden.

Auch hier wird dann, wie schon im letzten Beispiel zuvor, der Inhalt des Arrays ausgegeben. Am Ende des Script-Abschnitts wird mit der Document-Methode write noch die Anzahl der im Array enthaltenen Elemente ausgegenen.

<script language="javascript" type="text/javascript">
<!-- // JavaScript-Bereich für ältere Browser auskommentieren
// Aufzählung der Elemente, die im Array gespeichert werden sollen.
var pizza = new Array ('Thunfisch', 'Spinat', 'Zwiebel', 'Hawaii', 'Salami');
// Inhalt des Arrays ausgeben
document.write ('Inhalt von pizza: ');
for (i = 0; i < pizza.length; i++)
  document.write ('<br>&nbsp;pizza[' + i + ']: ' + pizza[i]);
// Anzahl der Elemente im Array ausgeben
document.write ('<br>Elemente in Array pizza: ' + pizza.length);
// -->
</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