Übungen zu Arrays

Aufgabe 1) Haustiere

var haustiere = new Array( "Hund", "Katze", "Adler"
                         , "Meerschweinchen", "Hamster", "Amsel"
                         , "Maus", "Ratte", "Fink", "Kaninchen" );

a) Geben Sie aus dem obigen Array - ohne Verwendung einer Schleife - die Nagetiere aus!

Aufgabe verstanden?
  • Wie soll die Ausgabe Ihres Programms lauten?
    "Meerschweinchen, Hamster, Maus, Ratte"
  • Welchen Befehl verwenden Sie für die Ausgabe?
    z.B. document.write
  • Wie greift man auf die Elemente eines Arrays zu?
    haustiere[x], wobei x den Index des Felds angibt

b) Geben Sie aus dem obigen Array die Vögel mit einer Schleife aus.

Aufgabe verstanden?
  • Wie soll die Ausgabe lauten?
  • Das wievielte Element ist jeweils ein Vogel?
  • Welche Schleife sollten Sie verwenden?
  • Wie greift man auf jedes X-te Element eines Arrays zu?

c) Wählen Sie aus dem obigen Array zufällig ein Haustier aus!

Aufgabe verstanden?
  • Wie viele Elemente hat das Array?
  • Wie adressiert man das letzte Element?
  • Was muss man tun, um eine ganze Zufallszahl zu ermitteln, welche zwischen 0 inkl. und dem letzten Element des Arrays liegt?

Ergänzungen für Fortgeschrittene

D.h. Schüler - welche eine 1 oder eine 2 erreichen möchten - sollten die folgenden Aufgabenstellungen problemlos umsetzen können!
  1. Nutzen Sie für Ihre Ausgaben ein div-Tag mit id und innerHTML.
  2. Schreiben Sie Ihre Quelltexte jeweils in eine Funktion und rufen Sie diese über einen Button auf (onclick).

Aufgabe 2) Pferdeboxen

Im Reitstall gibt es zehn Boxen zum Einstellen von Pferden. Diese sind gekennzeichnet mit Schildern von 1-10.

Sie sollen in einem Array zwischenspeichern, welches Pferd gerade in welcher Box steht.
Folgendes ist zu tun:
  • Legen Sie ein Array namens "Pferdeboxen" mit 10 unbelegten Speicherplätzen an.
  • Stellen Sie das Pferd mit dem Namen "Peggy" in die erste Box.
  • Stellen Sie das Pferd mit dem Namen "Moritz" in die vierte Box.
  • Stellen Sie das Pferd mit dem Namen "Dangerous" in die zehnte Box.
  • Geben Sie zur Kontrolle in einer Schleife die Belegung der Boxen aus.
    • Der Ausgabetext soll jeweils wie folgt lauten: "In Pferdebox Nr.X steht das Pferd namens Y",
      wobei X die Nummer der Box ist entsprechend Schild und Y der Name des Pferds.
    • Die 10 Ausgaben sollen untereinander stehen.

Aufgabe 3) Namen

Damit beim Schreiben eines Arrays kein Komma und kein Anführungsstrich vergessen wird, schreibt man das Array ...
var namen = new Array( 1, "Bernd", 2, "Anna", 3, "Michael", 4, "Katharina", 5, "Frank", 6, "Susanne" );
... besser wie folgt.
var namen = new Array( 1, "Bernd"
                     , 2, "Anna"
                     , 3, "Michael"
                     , 4, "Katharina"
                     , 5, "Frank"
                     , 6, "Susanne" );

a) Geben Sie aus dem obigen Array nur die Namen unter Verwendung einer for-Schleife aus!

Tipp: Nutzen Sie das Attribut length des Arrays zur Längenermittlung für die Bedingung der Schleife!
Aufgabe verstanden?
  • Wie soll die Ausgabe Ihres Programms lauten?
  • Welche Schleife sollten Sie verwenden?
  • Was bedeutet length?
  • Zu welchem Zweck soll length hier benutzt werden?

Aufgabe 4) Hauptstadtratespiel

Verwenden Sie die folgende externe Javascript-Datei! Sie brauchen das Array nur in einer neuen Datei unter dem Namen
StaatenUndHauptstaedte.js abzuspeichern und folgende Zeile im Header Ihrer HTML-Datei zu ergänzen:
<script type="text/javascript" src="StaatenUndHauptstaedte.js"></script>
var StaatenUndHauptstaedte = new Array(
   "Belgien",      "Brüssel",
   "Dänemark",     "Kopenhagen",
   "Deutschland",  "Berlin",
   "Griechenland", "Athen",
   "Italien",      "Rom",
   "Niederlande",  "Amsterdam",
   "Schweden",     "Stockholm",
   "Spanien",      "Madrid"
);
  • Das Array können Sie jetzt genauso verwenden, wie ein Array, welches in Ihrem Quellcode stehen würde.
  • Eine geeignete Abbruchbedingung wird benötigt, damit die Rateschleife wieder verlassen werden kann.
    Diese können Sie mit der Funktion confirm realisieren.
  • Weitere Länder und Hauptstädte können Sie später einfügen, wenn Ihr Programm läuft.
  • Später könnten Sie das Ratespiel auch entsprechend Ihrer Interessen ergänzen und zum Beispiel Musik, Filme oder Vokabeln erraten, indem Sie für die neuen Themen weitere externe Dateien erzeugen und einbinden in das Programm.

Auf dem Bildschirm könnten Sie zum Beispiel folgende Ausgaben erzeugen:
HauptstadtRatespiel.PNG

Aufgabe 5) Würfeln

a) Füllen Sie ein 100-Felder-Array mit Zufallszahlen von 1-6!
b) Zählen Sie das Auftreten der Zahlen in folgendem Array:
var zaehler = new Array( 0, 0, 0, 0, 0, 0 );
c) Werten Sie die Zählerstände aus und geben Sie z.B. die folgende Ausgabe aus:
Die Zahlen 1-6 traten in 100 Würfen in der folgenden Häufigkeit auf:
1:16x 2:17x 3:16x 4:14x, 5:19x, 6:18x
Die Zahl 5 trat am häufigsten auf.
Die Zahl 4 trat am wenigsten auf.
Eine etwas leichtere Variante:
Erzeugen Sie 100 Zufallszahlen im Bereich von 1-10, z.B. wie folgt:
zufallszahl = Math.floor( Math.random()*10 ) + 1;
  • Schreiben Sie die Zufallszahlen in ein Array mit 100 Feldern.
  • Zählen Sie das Auftreten der Zahl 3.
  • Geben Sie das Ergebnis aus.

Aufgabe 6) Temperaturen

1. Füllen Sie ein Array mit zufälligen Temperaturwerten zwischen -20 und 40 Grad Celsius (Kommawerte).
2. Geben Sie die 100 Werte des Arrays mit einer For-Schleife aus.
3. Die Werte sind mit zwei Nachkommastellen und mit Komma und Leerzeichen getrennt auszugeben.
Tipps:
  • Nutzen Sie die Funktionen Math.random() und Math.ceil() bzw. Math.floor() zur Erzeugung der Zufallszahlen!
  • Verwenden Sie für die Darstellung der Fließkommazahlen bei der Ausgabe die Funktion toFixed(2).

Aufgabe 7) Kontostände

a) Legen Sie ein Array an zwecks Speicherung der Kontostände der letzten 1000 neuen Bankkunden.
b) Ermitteln Sie per Zufallsgenerator zufällige Kontostände zwischen -10.000 und 250.000 Euro
und füllen Sie damit das Array.
c) Geben Sie das Array-Feld mit dem niedrigsten Kontostand aus, z.B. konstostaende[3] = -9.173,82 Euro.
d) Geben Sie das Array-Feld mit dem höchsten Kontostand aus, z.B. kontostaende[234] = 963.234,34 Euro
e) Geben Sie den durchschnittlichen Kontostand aus,
z.B. so: "Das Guthaben der neuen Bankkunden beträgt durchschnittlich 134.872 Euro".

Aufgabe 8) Youtube-Videos

Youtube verwendet für jedes gespeicherte Video einen Identifier (identification = ID). Sobald Sie sich ein Video ansehen, finden Sie die ID in der URL hinter den beiden Zeichen "v=". Die ID in der URL
http://www.youtube.com/watch?v=MlPh_ycy62s ist also "MlPh_ycy62s"
a) Legen Sie ein Array an zwecks Speicherung Ihrer liebsten Videos!
b) Füllen Sie das Array mit mehreren IDs von Youtube-Videos, z.B. mittels prompt!
c) Geben Sie in einer While-Schleife eine Liste aller gespeicherten IDs aus.
d) Erzeugen Sie mit einer Do/While Schleife eine Liste der kompletten URLs aller Videos.
e) Erzeugen Sie mit einer for-Schleife eine Liste von anklickbaren HTML-Links.


Übungsblatt: Download

Aufgabe 9) Personen-Verwaltung

Als Vorstufe zu einer echten Datenbankeingabe dient diese Übung.
personenverwaltung.png
a) Erstellen Sie eine Javascript-Datei mit einem Array, welches Personendatensätze aufnehmen kann,
z.B mit Vorname, Nachname, Geburtsdatum und Wohnort.
b) Erstellen Sie eine HTML-Seite mit einem Formular zur Eingabe weiterer Personendatensätze
c) Zeigen Sie jeweils alle Änderungen im Array an in einer separaten Ausgabe mit innerHTML in einem <div id="ausgabe"></div>
d) Suchen Sie jeweils nach einem Datensatz durch Eingabe eines Suchbegriffs und zeigen Sie den Datensatz im Formular an.

Aufgabe 10) Übungen mit Zahlenspielereien

Ü1:

a) Legen Sie ein leeres Array an!
b) Füllen Sie mit 5 einzelnen Anweisungen die ersten 5 Felder mit den folgenden Zahlen: 3, 45, 5, 47, 7
c) Geben Sie in einer While-Schleife alle Zahlen größer als 40 aus!

Ü2:

a) Legen Sie ein leeres Array an!
b) Füllen Sie mit 5 einzelnen Anweisungen die ersten 5 Felder mit den folgenden Zahlen: 2, 43, 4, 45, 6
c) Geben Sie in einer Do/While-Schleife alle Zahlen kleiner als 25 aus!

Ü3:

a) Lesen Sie in einer Schleife fünf ganze Zahlen (Nutzereingaben) in ein Array ein!
b) Ermitteln Sie!
  • die Summe der Zahlen
  • den Mittelwert
  • die größte Zahl
  • die kleinste Zahl
c) Geben Sie Ihre Ergebnisse geeignet aus.

Hinweise/Ergänzungen:
  • Prüfen Sie die Eingaben. Es müssen 5 Zahlen korrekt eingegeben werden!
  • Testen Sie Ihr Programm mit positiven und negativen Zahlen!
  • Erweitern Sie das Programm so,
    • dass die Anzahl der einzulesenden Zahlen vorher vom Nutzer festgelegt werden kann (z.B. 2-10 Zahlen)
    • das nur die Eingabe ganzer Zahlen erlaubt ist
    • ...

Ü4:

Spielen Sie Computer und arbeiten Sie den folgenden Programmabschnitt ab.
Die genutzten Array-Felder von a enthalten identische Werte entsprechend Aufgabe 1a.
Welche Ausgabe erscheint auf dem Bildschirm?
for( var i=0; i<5; i++ )
{
   if( a[i]< 10 )
   {
     document.write(a[i]);
   }
}
Ausgabe: ?

Ü5:

Spielen Sie Computer und arbeiten Sie den folgenden Programmabschnitt ab.
Die genutzten Array-Felder von a enthalten identische Werte entsprechend Ü2.
Welche Ausgabe erscheint auf dem Bildschirm?
for( var i=0; i<a.length; i++ )
{
   if( a[i]>4 )
   {
     document.write(a[i]);
   }
}
Ausgabe: ?

Ü6 - Das folgende Programm kopiert Werte aus dem Array c in das Array b

    var c = new Array(86,24,26,23,76,26,68,65,77,88,9,58,35);
    var b = new Array();
    var i;
 
    for( i=0; i<c.length; i++ )
    {
      if( i<=8 )
      {
        b[i] = c[3+i];
      }
      else
      {
        b[i] = c[i]*2;
      }
    }
 
    for(i=0; i<b.length; i++)
    {
      document.write( "b[" + i + "] = " + b[i] + "<br>" );
    }
 
 
a) Tragen Sie den Inhalt des Arrays b nach Ausführung des obigen Programms in die Tabelle ein!
b) Bringen Sie das Programm zum Laufen und vergleichen Sie die zuvor von Ihnen durch Nachdenken ermittelten Werte!
Array-
Elemente
Array b
Inhalt
b[0]
?
...
?
...
?
...
?
...
?
...
?
...
?
...
?
...
?
...
?
...
?
...
?
b[12]
?


Ideen für weitere Aufgabenstellungen finden Sie hier:

Umfangreichere Skripte:
Reine Array-Übungen: