![]() | ![]() ![]() ![]() ![]() ![]() |
Um auf die Elemente eines Feldes zuzugreifen kann entweder ein numerischer
Index oder eine Zeichenkette als Index verwendet werden. Zum Beispiel :
Ein Array besitzt folgende Methoden :
Beschreibung
Es wird ein Telefonbuch angezeigt. Dies ist nach verschiedenen Kriterien
sortierbar. Neue Einträge können hinzugefügt werden.
Quelltext
<head>
<script language="JavaScript">
<!--
function ent(vnam, nnam, tele) {
this.vnam=vnam;
this.nnam=nnam;
this.tele=tele;
this.toString=tos;
}
order="";
function tos() {
if(order == "vnam") {
return this.vnam;
} else {
return this.nnam;
}
}
function show() {
var win=window.open("","telefonbuch",
"width=300,height=300,scrollbars=yes");
win.focus();
if(document.form1.ord[0].checked) {
order="vnam";
arr.sort();
} else if(document.form1.ord[1].checked) {
order="nnam";
arr.sort();
} else if(document.form1.ord[2].checked) {
arr.sort(cmpnum);
}
if(document.form1.rev.checked)arr.reverse();
win.document.open();
win.document.write("<title>Telefonbuch</title>");
win.document.write("<center>");
win.document.write("<table border>");
for(ii=0; ii<arr.length; ii++) {
win.document.write("<tr><td>"+arr[ii].vnam+
"<td>"+arr[ii].nnam+
"<td align=right>"+arr[ii].tele+"<br>");
}
win.document.write("</table>");
win.document.write("<p>");
win.document.write("<form><input type=button value='OK' "+
"onClick='self.close()'></form>");
win.document.write("</center>");
win.document.close();
}
function add() {
var tele=parseInt(document.form1.tele.value);
if(isNaN(tele)) {
alert("unzulaessige Telefonnummer");
return;
}
if(document.form1.nnam.value == "") {
alert("unzulaessiger Nachname");
return;
}
arr[arr.length]=new ent(document.form1.vnam.value,
document.form1.nnam.value, tele);
show();
}
function cmpnum(inp1, inp2) {
return inp1.tele-inp2.tele;
}
function init() {
arr=new Array();
arr[0]=new ent("Frodo", "Baggins", 1001);
arr[1]=new ent("Peregrin", "Took", 1007);
arr[2]=new ent("Meriodoc", "Brandybuck", 1010);
arr[3]=new ent("Samwise", "Gamgee", 999)
}
//-->
</script>
</head>
<body onLoad="init();">
<form name=form1>
<h4>Sortiere nach</h4>
<input type=radio name="ord" value="vnam"> Vorname
<input type=radio name="ord" value="nnam" checked> Nachname
<input type=radio name="ord" value="tele"> Telefon
<br>
<input type=checkbox name="rev"> rückwärts
<br>
<input type=button value="Sort" onClick="show();">
<h4>neuer Eintrag</h4>
<table><tr><td>Vorname :<td>Nachname :<td>Telefon :<tr>
<td><input type=text name="vnam" size=20>
<td><input type=text name="nnam" size=20>
<td><input type=text name="tele" size=10>
</table>
<input type=button value="Add" onClick="add();">
</form>
</body>
Erläuterung
Für die einzelnen Einträge des Telefonbuchs wird ein eigener
Objekt-Typ definiert. Hierzu dient die "constructur function" ent.
Das damit erzeugte Objekte hat die Eigenschaften vnam, nnam
und tele (Vorname, Nachname, Telefonnummer) und legt zudem
die Methode toString fest: diese weist auf die function tos.
Die function tos liefert in Abhängigkeit vom Schalter order
entweder den Vornamen oder den Nachnamen als Ergebnis.
Die einzelnen Einträge ent werden in dem Feld arr abgelegt;
zum Sortieren wird die Array-Methode sort verwendet.
Bei einer alphabetischen Sortierung (nach Vor- oder Nachname) verwendet
sort standardmäßig die toString-Methode der
im Feld enthaltenen Objekte; diese haben wir ja als function tos
definiert.
Für die numerische Sortierung (nach Telefonnummer) wird an sort
die selbstdefinierte Vergleichsfunktion cmpnum übergeben.
Referenz
[Array]
[sortieren]
[Neu in V 1.2]
Array (Feld)
In einem Feld können z.B. numerische Werte, Zeichenketten aber auch
wiederum Objekte gespeichert werden. Insbesondere können die einzelnen
Elemente wiederum Arrays sein, um auf diese Weise mehrdimensionale Arrays
zu erzeugen.
Um ein Feld zu erzeugen gibt es folgende Alternativen:
arr1 = new Array();
arr2 = new Array(zahl);
arr3 = new Array(elem0, elem1, ... elemn);
Im ersten Beispiel wird ein zunächst leeres Feld (mit 0 Elementen) erzeugt.
Im dritten Beispiel wird ein Feld mit n Elementen erzeugt, die mit
den als Parameter übergebenen Elementen elem0 bis elem1
gefüllt sind.
In JavaScript Version 1.1 wird im zweiten Beispiel
ein Feld mit zahl Elementen erzeugt, diese Elemente sind
zunächst leer.
Wenn im <script>-tag angegeben wird
language="JavaScript1.2",
(Version 1.2) dann wird hingegen ein
Feld mit einem Element, das den Wert zahl enthält,
erzeugt.
numerischer Index
arr=new Array();
arr[0]="Laura";
arr[1]="Birgit";
arr[2]="Uwe";
for(ii=0; ii<arr.length; ii++) {
document.write(ii+" = "+arr[ii]+"<br>");
}
Zeichenkette als Index
arr=new Array();
arr["Laura"]=4;
arr["Birgit"]="verrat ich nicht";
arr["Uwe"]=41;
document.write("Laura ist "+arr["Laura"]+ " Jahre alt<br>");
document.write("Uwe ist "+arr.Uwe + " Jahre alt<br>");
for (elm in arr) {
document.write(elm+" = "+arr[elm]+"<br>);
}
Die Eigenschaft length des erzeugten Arrays gibt die Anzahl der
enthaltenen Elemente an. Die Zahl erhöht sich automatisch, wenn einem
bisher nicht vorhandenen Feldelement ein Wert zugeweisen wird. Beispiel :
arr=new Array("wert0", "wert1");
arr[4]="wert4";
Zunächst wird ein Feld mit zwei Elementen (arr[0] und arr[1]) erzeugt;
damit ist arr.length gleich 2. Mit der zweiten Anweisung wird dem bisher
nicht vorhandenen Element arr[4] ein Wert zugewiesen. JavaScript erhöht
damit automatisch arr.length auf 5; es entstehen darüber hinaus
die Elemente arr[2] und arr[3] mit undefiniertem Inhalt.
sort([cmp]) | Die Elemente des Arrays werden entsprechend der Werte der Elemente sortiert. Siehe unten. |
reverse() | Die Reihenfolge der Elemente wird umgekehrt. |
join([sep]) | Die Werte aller Elemente des Arrays werden in Zeichenketten umgewandelt und zu einem String zusammengefügt. Dabei wird als Trennzeichen standardmäßig das Komma oder aber das explizit angegebene Zeichen sep verwendet. |
Sortieren
Mit der Methode sort kann ein Array sortiert werden.
Standardmäßig wird dabei von alle Elementen, die nicht sowieso
Zeichenketten sind, die Darstellung als Zeichenketten
(mittels der Methode toString) betrachtet und dann
lexikalisch sortiert. Enthält das Feld z.B. die beiden numerischen
Werte 99 und 100, dann werden diese als Zeichenketten "99" und "100" betrachtet;
in der lexikalischen Sortierung kommt dann zuerst "100" und erst danach die
"99". Wenn nun eine echte numerische Sortierung gewünscht wird,
dann muß eine eigene Vergleichsfunktion definiert und als Parameter
übergeben werden. Die Vergleichsroutine muß in der Lage sein,
zwei als Eingabeparameter übergebene Elemente des Arrays zu vergleichen.
Sie soll als Ergebnis liefern :
einen positiven Wert, wenn der zweite Eingabewert hinter dem ersten
einsortiert werden soll,
0, wenn beide Eingabewerte gleichwertig sind,
einen negativen Wert, wenn der erste Eingabewert hinter dem zweiten
einsortiert werden soll.
Für eine numerische Sortierung könnte ein Beispiel so aussehen :
function compare(inp1, inp2) {
return inp1-inp2;
}
arr=new Array(100, 99, 101, 98);
arr.sort(compare);
for(ii=0; ii<arr.length; ii++) {
document.write(ii+" = "+arr[ii]+"<br>");
}
Neu in Version 1.2
In V 1.2 gibt es folgende neue Methoden :
concat(arr2) |
arr3=arr1.concat(arr2) erzeugt ein neues Array arr3, das sowohl die Elemente von arr1 als auch von arr2 enthält. Zeichenketten und numerische Werte werden kopiert, Objekte werden referenziert. | V 1.2 |
pop() | Liefert das derzeit letzte Element im Array und löscht dieses dann aus dem Array. | V 1.2 |
push(elem0 [,elem1,...]) | Hängt ein oder mehrere übergebene Elemente elem0, elem1, ... an das Array an und liefert als Ergebnis das zuletzt angehängte Element. | V 1.2 |
shift() | Liefert das derzeit erste Element im Array und löscht dieses dann aus dem Array. | V 1.2 |
unshift(elem0 [,elem1,...]) | Fügt ein oder mehrere übergebene Elemente elem0, elem1, ... am Anfang des Arrays ein und liefert als Ergebnis die neue Länge des Feldes. | V 1.2 |
slice(von [,bis]) | Liefert als Ergebnis ein neues Array, das die Elemente ab von bis exclusive bis des urspünglichen Feldes enthält. Wenn bis nicht angegeben wird, dann geht der Ausschnitt bis zum letzten Element; wenn bis negativ ist, dann wird es als relative Angabe zum Ende des Feldes verstanden. | V 1.2 |
splice(von, anz [,elem0, elem1, ...]) | Es werden vom Element von beginnend anz Elemente gelöscht und dafür die neuen Elemente elem0, elem1, ... eingefügt. Als Ergebnis wird ein Array der gelöschten Elemente zurückgegeben. Die Anzahl der neuen Elemente darf sich von der Anzahl der gelöschten Elemente unterscheiden. | V 1.2 |
In V 1.2 gibt es eine neue Schreibweise ("literal notation"), um mit Elementen gefüllte Arrays zu initialisieren. Die beiden Zeilen
arr = new Array(elem0, elem1, ..., elemn); arr = [elem0, elem1, ..., elemn];sind gleichwertig.
Auf der nächsten Seite gibt es noch etwas Vermischtes von JavaScript Version 1.1 |
![]() ![]() |