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 Eigenschaftentitle
,author
undpages
hat, um Informationen zu einem Buch zu speichern. Füge eine MethodeprintSummary
hinzu, die den Titel und den Autor des Buches in der Konsole ausgibt. Die MethodeprintSummary
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 einemarke
(string) undjahr
(number) Eigenschaft haben sowie einestartEngine
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
undjahr
- 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 dannmap
, um ein neues Arraysquares
zu erstellen, in dem jedes Element das Quadrat des jeweiligen Wertes innumbers
ist.map
sollte für jedes Element innumbers
aufgerufen werden, und das neue Arraysquares
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 verwendefilter
, um ein ArrayevenNumbers
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"]
. Verwendefind
, um die erste Frucht zu finden, die mit "M" beginnt, undindexOf
, 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 findenindexOf
-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ügenshift
-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 VariablenfirstColor
undsecondColor
zu speichern und den Rest in ein ArrayotherColors
. 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 ArrayextendedArray
, das die Werte vonnumArray
enthält, gefolgt von4
und5
. 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