Zum Hauptinhalt springen

Methoden und Objekte

Übungen zu Methoden und Objekten

In diesen Übungen wirst du mit Objekten und Methoden in JavaScript arbeiten. Du wirst lernen, wie man Objekte erstellt, Eigenschaften und Methoden hinzufügt, Arrays verwendet und Array-Methoden anwendet. Zudem wirst du das Destructuring, den Spread-Operator und Rest-Parameter einsetzen, um deine Programme effizienter und lesbarer zu gestalten.


1. Objektliterale und Zugriff auf Eigenschaften

  • Aufgabe: Erstelle ein Objekt book, das die Eigenschaften title, author und pages hat, um Informationen zu einem Buch zu speichern. Füge eine Methode printSummary hinzu, die den Titel und den Autor des Buches in der Konsole ausgibt. Die Methode printSummary sollte eine Zeile wie „The book 'XYZ' is written by ABC“ ausgeben.

Nutze hierfür:

  • Objektliterale { ... }
  • Eigenschaften (title, author, pages)
  • Methoden in Objekten

2. Property- und Methodenshorthand

  • Aufgabe: Nutze die Property- und Methodenshorthand, um ein car Objekt zu erstellen. Das Objekt sollte eine marke (string) und jahr (number) Eigenschaft haben sowie eine startEngine Methode, die die Nachricht "The engine is starting" ausgibt. Verwende die Kurzschreibweise für Eigenschaften und Methoden, um dein Objekt kompakter und lesbarer zu machen.

Nutze hierfür:

  • ES6 Property Shorthand für marke und jahr
  • Methodenshorthand für startEngine()

3. Arrays erstellen und Array-Methoden anwenden

  • Aufgabe: Erstelle ein Array numbers mit den Werten [1, 2, 3, 4, 5]. Verwende dann map, um ein neues Array squares zu erstellen, in dem jedes Element das Quadrat des jeweiligen Wertes in numbers ist. map sollte für jedes Element in numbers aufgerufen werden, und das neue Array squares sollte Werte wie [1, 4, 9, 16, 25] enthalten.

Nutze hierfür:

  • Array-Literale [ ... ]
  • map-Methode, um das Array zu transformieren

4. Filtermethode

  • Aufgabe: Nutze das numbers Array aus der vorherigen Aufgabe und verwende filter, um ein Array evenNumbers zu erstellen, das nur die geraden Zahlen enthält. Dein neues Array sollte nur die Elemente enthalten, die eine Bedingung erfüllen, und das Ergebnis sollte [2, 4] sein.

Nutze hierfür:

  • filter-Methode, um Array-Elemente zu filtern
  • Bedingte Logik für die Bestimmung von geraden Zahlen

5. Suchmethoden: find und indexOf

  • Aufgabe: Erstelle ein Array fruits mit den Werten ["Apple", "Banana", "Mango", "Orange"]. Verwende find, um die erste Frucht zu finden, die mit "M" beginnt, und indexOf, um die Position von "Banana" zu ermitteln. Diese Methoden helfen dir, Elemente gezielt aus einem Array auszuwählen oder deren Position zu bestimmen.

Nutze hierfür:

  • find-Methode, um die erste Übereinstimmung zu finden
  • indexOf-Methode, um die Position eines bestimmten Elements zu bestimmen

6. Array-Modifikation mit push, pop, shift, und unshift

  • Aufgabe: Nimm das Array fruits und füge "Grapes" am Ende hinzu. Entferne dann das erste Element und gib es in der Konsole aus. Diese Array-Methoden sind nützlich, um Elemente dynamisch zu einem Array hinzuzufügen oder zu entfernen.

Nutze hierfür:

  • push-Methode, um ein Element ans Ende des Arrays hinzuzufügen
  • shift-Methode, um das erste Element zu entfernen und auszugeben

7. Destructuring von Arrays und Objekten

  • Aufgabe: Erstelle ein Array colors mit den Werten ["Red", "Green", "Blue", "Yellow"]. Verwende Array-Destructuring, um die ersten beiden Farben in die Variablen firstColor und secondColor zu speichern und den Rest in ein Array otherColors. Mit Destructuring kannst du auf elegante Weise spezifische Teile eines Arrays extrahieren.

Nutze hierfür:

  • Array-Destructuring-Syntax [a, b, ...rest]
  • Variablenzuweisung

8. Spread-Operator für Arrays und Objekte

  • Aufgabe: Erstelle ein Array numArray mit den Werten [1, 2, 3]. Erstelle dann ein neues Array extendedArray, das die Werte von numArray enthält, gefolgt von 4 und 5. Der Spread-Operator ermöglicht es dir, Arrays einfach zu erweitern oder zu kombinieren.

Nutze hierfür:

  • Spread-Operator ... für Arrays
  • Array-Literale

9. Rest-Parameter in Funktionen

  • Aufgabe: Schreibe eine Funktion sumAll, die beliebig viele Argumente annehmen und deren Summe berechnen kann. Der Rest-Parameter gibt dir die Möglichkeit, eine unbestimmte Anzahl von Argumenten als Array zu erfassen, das du dann verarbeiten kannst.

Nutze hierfür:

  • Rest-Parameter ...params in der Funktionsdefinition
  • reduce-Methode, um die Summe zu berechnen