Javascript-Arrays im Griff
Die lokale Speicherung von Daten ist unter Javascript am besten mithilfe von Arrays zu realisieren. Wir zeigen Ihnen, was Sie dabei beachten sollten.
- Javascript-Arrays im Griff
- Arbeiten mit Arrays
- Mehrdimensionale Arrays
Arrays dienen dazu, mehrere Werte in einer Liste unter einer Variable zu speichern, beispielsweise die Anzahl der Punkte eines jeden Fahrers in der laufenden Formel-1-Saison. Für den Zugriff auf die Daten verwenden Sie entweder den Index des Elements - dieser wird automatisch vergeben - oder altern...
Arrays dienen dazu, mehrere Werte in einer Liste unter einer Variable zu speichern, beispielsweise die Anzahl der Punkte eines jeden Fahrers in der laufenden Formel-1-Saison. Für den Zugriff auf die Daten verwenden Sie entweder den Index des Elements - dieser wird automatisch vergeben - oder alternativ einen beliebigen Namen. Zu jedem Array können Sie beliebig viele zusätzliche Elemente hinzufügen oder bestehende Daten aktualisieren.
Deklaration eines Arrays
Im Gegensatz zur Deklaration einer Variablen benötigen Sie bei der Definition eines Arrays einen Konstruktor. Das Erzeugen eines Arrays ist also ein zweistufiger Vorgang.
var f1_fahrer;
f1_fahrer = new Array();So erzeugen Sie ein neues leeres Array - alternativ können Sie auch ein Array mit einer vordefinierten Anzahl von Elementen anlegen. Dafür geben Sie dem Array als Parameter die Anzahl der Elemente mit.
f1_fahrer = new Array(24);Das Array hat somit Platz für alle 24 Fahrer der aktuellen Formel-1-Saison. Als dritte Variante geben Sie dem Array bei der Erzeugung bereits alle Werte mit.
f1_fahrer = new Array("Button",
"Hamilton", "Schumacher", "Rosberg",
"Vettel", "Webber",..., "Glock");Zugriff auf die Elemente
Nachdem Sie ein Array erzeugt haben, greifen Sie am besten über den Index auf die einzelnen Elemente zu. Die Nummerierung beginnt dabei mit dem Zählerstand 0.
var f1_fahrer;
f1_fahrer = new Array("Button",
"Hamilton", "Schumacher", "Rosberg",
"Vettel", "Webber", "Glock");
alert(f1_fahrer[0]);
alert(f1_fahrer[1]);
...
alert(f1_fahrer[6]);Weitere Array-Konstruktoren
Daneben können Sie einem Array auch während des Programmablaufs Werte zuweisen. Dabei haben Sie die Auswahl zwischen einem Array mit einer vordefinierten Anzahl an Feldern und einem Array mit einer freien Anzahl. Im Array f1_motorleistung sollen die PS-Werte der Formel-1-Rennwagen gespeichert werden. Im Beispiel gibt es vier Motoren mit den PS-Stärken 760, 780, 805 und 810.
var f1_motorleistung = new Array(4);
f1_motorleistung[0] = 810;
f1_motorleistung[1] = 780;
f1_motorleistung[2] = 805;
f1_motorleistung[3] = 760;In der dritten Variante sind weder die Anzahl der Elemente noch deren Werte bekannt. Sie legen ein undefiniertes Array an und speichern darin Ihre Daten.
var f1_rennstall = new Array();
f1_rennstall[0] = "Vodafone McLaren
Mercedes"
f1_rennstall[1] = "Mercedes GP
Petronas Formula One Team"
f1_rennstall[2] = "Red Bull Racing"
f1_rennstall[3] = "Scuderia Ferrari
Marlboro"Das Array wird somit dynamisch erweitert und passt sich entsprechend an.
Zugriff auf die Array-Inhalte
Auf den Wert eines Elements innerhalb des Arrays greifen Sie, wie im obigen Beispiel gesehen, über den Namen des Arrays sowie dem entsprechenden Index zu. Mit diesem Wert können Sie direkt weiterarbeiten - beispielsweise weisen Sie diesen einer neuen Variable zu oder Sie geben den zugewiesenen Inhalt auf einer HTML-Seite aus.
document.write(f1_rennstall[3]);
var fuehrende = f1_rennstall[2];Beim Zugriff auf ein Array-Element müssen Sie nicht zwingend eine Zahl mitgeben, eine Variable, der Sie zuvor den entsprechenden Index mitgegeben haben, ist ebenfalls ausreichend. Damit können Sie auf definierte äußere Faktoren reagieren.
var liste = new Array("Element1",
"Element2", "Element3");
var index;
var eingabe = "D";
switch (eingabe) {
case "A":
index = 0;
break;
case "B": case "D":
index = 1;
break;
case "C":
index = 2;
break;
}
document.write("Das Ergebnis lautet "
+ liste[index]);Im Beispiel haben Sie ein Array mit drei Elementen. Basierend auf dem Wert von eingabe weisen Sie der Variablen index 0, 1 oder 2 zu. Dabei verweisen mehrere unterschiedliche Werte von eingabe auf das gleiche Array-Element. Mit diesem Ansatz können Sie die Ausgabe des Array-Werts mit nur einer Programmierzeile realisieren.
