Brückenkurs Websites und Webapps/Objekte in Arrays

Wiki-Quelltext dieser Seite.

<language>Javascript</language>
Gleichartige Objekte können in Arrays zusammengefasst werden.


'''Beispiel 1'''

Das Array ''personen'' enthält 3 Person-Objekte:

<code id="58fbab26da5d3">
var personen = [ {vorname: "Hans", name: "Müller", alter: 45, geschlecht: "m"}, 
                 {vorname: "Igor", name: "Ochirov", alter: 25, geschlecht: "m"},  
                 {vorname: "Marta", name: "Kowalska", alter: 15, geschlecht: "w"} 
               ];
</code>
<run id="58fbab26da648">
//Gib die Anzahl der Objekte im Array aus:
console.log(personen.length);
</run>

Das Array wird durch eckige Klammern [] begrenzt. Die Objekte im Array werden durch Kommas voneinander getrennt.


'''Beispiel 2'''

Wir können auf die Eigenschaften eines Objektes im Array zugreifen. 

Beispiel: Der Vorname des ersten Objektes im Array soll angezeigt werden.

<run id="58fbab26da6af">
console.log(personen[0].vorname);
</run>


'''Beispiel 3'''

Mit einer for-Schleife können wir alle Objekte eines Arrays "besuchen".

Beispiel: Die Vornamen aller Objekte im Array sollen angezeigt werden.

<run id="58fbab26da713">
for(var i=0; i<personen.length; i++){
  
   console.log(personen[i].vorname);
}
</run>


Sie können auch mit einer Hilfsvariable arbeiten. Folgende Variante ist z.B. ebenfalls gültig:

<run id="58fbb226cd198">
for(var i=0; i<personen.length; i++){
   
   //Speichere das Objekt an der Position i in der Variable p
   var p = personen[i];  //p ist nun eine Referenz auf das Person-Objekt an der Position i
   console.log(p.vorname);
}
</run>


'''Beispiel 4'''

Mit einer for-Schleife können wir bestimmte Eigenschaften für alle Objekte eines Arrays ändern.

Beispiel: Gegeben ist ein Array mit Buch-Objekten. Bei allen Büchern soll der Preis um 10 (Euro) erhöht werden.

<code id="58fbb226cd0d4">
var buecher =  [ {autor: "Paul Hans", titel: "Erfolgreiche Kaninchenzucht", preis: 25.49, anzahlSeiten: 650},
                 {autor: "Paul Hans", titel: "Erfolgreiche Kaninchenzucht - Band 2", preis: 35.49, anzahlSeiten: 780}, 
                 {autor: "Sabine Wittek", titel: "Mit Hunden reden", preis: 15.99, anzahlSeiten: 350},  
                 {autor: "Igor Ochirov", titel: "Weltreisen für Individualisten", preis: 95.99, anzahlSeiten: 420}, 
                 {autor: "Lakazel", titel: "Sterne fotografieren", preis: 45.99, anzahlSeiten: 100}, 
               ];
</code>
<run id="58fbb226cd217">
for(var i=0; i< buecher.length; i++){

  buecher[i].preis = buecher[i].preis + 10; //alternativ: buecher[i].preis += 10;
  
  console.log(buecher[i].preis);
}

</run>


'''Beispiel 5'''

Das Ändern oder Anzeigen von Eigenschaften kann unter bestimmte Bedingungen gestellt werden.

Beispiel: Alle Titel der Bücher von Paul Hans sollen angezeigt werden.

<run id="58fbb226cd285">
for(var i=0; i<buecher.length; i++){
  
   //Speichere das Objekt an der Position i in der Variable b
   var buch = buecher[i];

   if(buch.autor == "Paul Hans"){

     console.log(buch.titel);
   }

}
</run>


'''Beispiel 6'''

Objekte eines Arrays, die bestimmte Eigenschaften besitzen, können in ein zweites Array kopiert werden. Das zweite Array ist dann eine "gefilterte" Version von dem ursprünglichen Array.

Beispiel: Alle Bücher mit mehr als 400 Seiten werden in das Array ''dicke_buecher'' kopiert.

<run id="58fbb226cd2f0">

var dicke_buecher = [];

for(var i=0; i<buecher.length; i++){

  var buch = buecher[i];

  if(buch.anzahlSeiten > 400){

    dicke_buecher.push(buch);
  }
}

//Wie viele Bücher sind nun in dem gefilterten Array drin?
console.log(dicke_buecher.length);
</run>



'''Aufgabe 1'''

Gegeben ist ein Array mit 10 Personen. Geben Sie den Namen der ersten Person auf der Konsole aus (siehe Beispiel 2)!

<code id="58fbb5d9b64b3">
var personen = [ {vorname: "Hans", name: "Müller", alter: 45, geschlecht: "m"}, 
                 {vorname: "Igor", name: "Ochirov", alter: 25, geschlecht: "m"},  
                 {vorname: "Marta", name: "Kowalska", alter: 15, geschlecht: "w"}, 
                 {vorname: "Peter", name: "Müller", alter: 35, geschlecht: "m"}, 
                 {vorname: "Anna", name: "Ochirov", alter: 27, geschlecht: "w"},  
                 {vorname: "Stefan", name: "Müller", alter: 19, geschlecht: "m"}, 
                 {vorname: "Hans", name: "Meyer", alter: 46, geschlecht: "m"}, 
                 {vorname: "Manuel", name: "Hohlfeld", alter: 55, geschlecht: "m"},  
                 {vorname: "Stefanie", name: "Bayer", alter: 17, geschlecht: "w"}
               ];
</code>
<run id="58fbb5d9b654c">

</run>



'''Aufgabe 2'''

Wir arbeiten wieder mit dem Array ''personen'' aus Aufgabe 1. Geben Sie für jede Person Name und Alter nach folgendem Muster aus (siehe Beispiel 3):

 Müller, 45
 Ochirov, 25
 Kowalska, 15
 ...

<run id="58fbb5d9b65fa">
</run>



'''Aufgabe 3'''

Wir arbeiten wieder mit dem Array ''personen'' aus Aufgabe 1. Geben Sie für jede Person Nachname und Vorname nach folgendem Muster aus (siehe Beispiel 3):

 Müller, Hans
 Ochirov, Igor
 Kowalska, Marta
 ...

<run id="58fbb5d9b6693">
</run>



'''Aufgabe 4'''

Geben Sie die Namen aller männlichen Personen aus (siehe Beispiel 5):

<run id="58fbb5d9b670e">
</run>



'''Aufgabe 5'''


Geben Sie die Namen aller männlichen Personen aus, die älter als 40 Jahre sind:

<run id="58fbb5d9b6786">
</run>



'''Aufgabe 6'''

Fügen Sie alle weiblichen Personen in das Array ''weiblich'' ein:

<run id="58fbb6b03c986">
var weiblich = [];


</run>