Testen Sie Ihre Fähigkeiten: Objektorientiertes JavaScript
Das Ziel dieses Fähigkeitstests ist es zu überprüfen, ob Sie unseren Artikel Klassen in JavaScript verstanden haben.
Hinweis: Sie können die Lösungen in den interaktiven Editoren auf dieser Seite oder in einem Online-Editor wie CodePen, JSFiddle oder Glitch ausprobieren. Wenn es einen Fehler in Ihrem Code gibt, wird dieser im Ergebnisfeld auf dieser Seite oder in der JavaScript-Konsole protokolliert.
Wenn Sie nicht weiterkommen, können Sie uns über einen unserer Kommunikationskanäle erreichen.
OOJS 1
In dieser Aufgabe stellen wir Ihnen den Beginn einer Definition für eine Shape
-Klasse zur Verfügung. Sie hat drei Eigenschaften: name
, sides
und sideLength
. Diese Klasse modelliert nur Formen, bei denen alle Seiten gleich lang sind, wie ein Quadrat oder ein gleichseitiges Dreieck.
Wir möchten, dass Sie:
- Einen Konstruktor zu dieser Klasse hinzufügen. Der Konstruktor nimmt Argumente für die Eigenschaften
name
,sides
undsideLength
entgegen und initialisiert sie. - Eine neue Methode
calcPerimeter()
zur Klasse hinzufügen, die den Umfang (die Länge des äußeren Randes der Form) berechnet und das Ergebnis in die Konsole protokolliert. - Eine neue Instanz der
Shape
-Klasse namenssquare
erstellen. Geben Sie ihr denname
square
,4
sides
und einesideLength
von5
. - Ihre
calcPerimeter()
-Methode auf die Instanz anwenden, um zu sehen, ob sie das Berechnungsergebnis wie erwartet in die Konsole des Browsers protokolliert. - Eine neue Instanz von
Shape
namenstriangle
erstellen, mit demname
triangle
,3
sides
und einersideLength
von3
. triangle.calcPerimeter()
aufrufen, um zu überprüfen, ob es funktioniert.
Versuchen Sie, den Live-Code unten zu aktualisieren, um das fertige Beispiel nachzubilden:
Laden Sie den Ausgangspunkt für diese Aufgabe herunter, um in Ihrem eigenen Editor oder in einem Online-Editor zu arbeiten.
OOJS 2
Als nächstes möchten wir, dass Sie eine Square
-Klasse erstellen, die von Shape
erbt, und eine calcArea()
-Methode hinzufügt, die die Fläche des Quadrats berechnet. Richten Sie auch den Konstruktor so ein, dass die name
-Eigenschaft von Square
-Objektinstanzen automatisch auf square
gesetzt wird und die sides
-Eigenschaft automatisch auf 4
gesetzt wird. Beim Aufrufen des Konstruktors sollten Sie daher nur die sideLength
-Eigenschaft angeben müssen.
Erstellen Sie eine Instanz der Square
-Klasse namens square
mit passenden Eigenschaftswerten und rufen Sie deren calcPerimeter()
- und calcArea()
-Methoden auf, um zu zeigen, dass es funktioniert.
Versuchen Sie, den Live-Code unten zu aktualisieren, um das fertige Beispiel nachzubilden:
Laden Sie den Ausgangspunkt für diese Aufgabe herunter, um in Ihrem eigenen Editor oder in einem Online-Editor zu arbeiten.