OOP mit JavaScript Grundkurs

Explizite Klassendefinitionen

LinkedIn Learning kostenlos und unverbindlich testen!

Jetzt testen Alle Abonnements anzeigen
Anstelle von Prototypen – bzw. diese ergänzend – soll JavaScript in Zukunft explizite Klassendefinitionen bereitstellen, die auch Vererbung sowie statische Elemente und Datenkapselung über Getter und Setter bieten. Auch der Zugriff auf die Superklasse und das Overriding sind vorgesehen. Die Syntax lehnt sich dabei stark an Java bzw. C# an.
07:43

Transkript

Aktuell ist JavaScript prototypbasierend, nicht klassenbasierend. Für eine echte objketorientierte Programmierung möchte man allerdings Klassen haben. In ECMAScript 6 sollen echte Klassen in JavaScript Einzug halten, was vermutlich die größte Neuerung von ECMAScript 6 sein wird. Schon heute kann man in einigen Engines diese Klassen benutzen. Einige Browser unterstützen das bereits. Dazu wird man mit einem Schlüssewort "class" und dem Namen einer Klasse arbeiten und in dem Block gibt man dann gewisse Methoden oder Eigenschaften an, die zu dieser Klasse gehören werden. Ganz entscheidend ist, dass man hier auch einen expliziten Konstruktor definieren kann. Der Konstruktor wird mit dem Schlüsselwort "constructor" deklariert. Dabei greift man auf eine gewisse Philosophie zurück, die man schon früher hatte, eine Tradition, einem Konstruktor einen ausgewählten Namen zu geben, so wie "create" oder auch "constructor", was ja durchaus schon in anderem Kontext benutzt wird. Was man in JavaScript nicht machen kann, ist den Konstruktor so zu benennen, wie die Klasse, wie man es beispielsweise in Java oder in C# macht. Das aus dem einfachen Grund, dass nur der Bezeichner wirklich relevant für den Aufruf einer Konstruktion, einer Syntaxstruktur in JavaScript ist, und Parameter eben überhaupt keine Rolle spielen. Von daher hat man sich für diese Variante hier entschieden und die Deklaration von dem Konstruktor ist im Grunde wie eine normale Methode oder ein klassischer Konstruktor im aktuellen JavaScript zu sehen. Mit "this." verankert man Eigenschaften und Methoden tatsächlich in einem Objekt. Die Technik mit den Klassen geht aber weiter, denn man sieht hier mit "extends" eine Vererbungsebene. Das heißt, "Shape" ist die Superklasse einer Subklasse "Rectangle". Und hier etwas weiter unten auch eine Klasse "Circle". Man kann also eine echte Vererbung hier implementieren. Auch das wird bereits von einigen Engines tatsächlich unterstützt. Es geht auch, aus einer Subklasse auf die Superklasse zuzugreifen. Sie sehen hier im Konstruktor eine Syntax "super(id, x, y)". Das greift auf den constructor oder Konstruktor der Superklasse zu. Das Schlüsselwort "super" kann auch allgemein verwendet werden, um Eigenschaften der Superklasse anzusprechen. So etwas kennt man aus Java. Das ist sehr stark an der Java-Syntax und -Philosophie orientiert. Hier habe ich nun auch eine Methode toString(). und in der Subklasse wird sie redefiniert. Das ist ein echtes Überschreiben, also override, eine Technik, um vererbte Dinge zu verdecken. Wohlbemerkt "verdecken" hat in einigen Sprachen eine etwas andere Bedeutung als "überschreiben", das hier ist ein echtes Überschreiben. In der überschriebenen Methode hat man über das Schlüsselwort "super" Zugang zu der Methode aus der Superklasse, die überschrieben wurde. Auch die Definition von "getter" und "setter" steht zur Verfügung. Mit dem Schlüsselwort "set" gibt man einen Schreibzugriff auf eine Eigenschaft an und mit "get" einen Lesezugriff. Beachten Sie, dass der Name der setter-getter-Eigenschaft nicht identisch sein muss mit dem Namen, der intern benutzt wird. Es hängt nun von der Engine ab, ob es möglich ist nur getter oder nur setter zu implementieren oder ob immer gefordert wird, getter und setter bereitzustellen. Wenn man die Möglichkeit hat nur einen getter zu implementieren, dann hat man eine read-only-Eigenschaft. Wenn man nur einen setter setzen kann, hat man eine write-only-Eigenschaft. Das macht das Design von Klassen so extrem flexibel. Sie sehen hier, dass diese Klassen jetzt benutzt werden, indem ich Shape, also die allgemeine Superklasse instantiiere und danach eine Subklasse. Dann greife ich auf die Eigenschaft zu respektive hier auf die Methode der Superklasse und hier unten dann auf die überschriebene Methode der Subklasse. Wir schauen uns gleich die Ausgabe an. Ich möchte vorher noch eine weitere Besonderheit zeigen. Es gibt die Möglichkeit, static-Elemente, Klassenelemente zu deklarieren. Etwas, was es derzeit in JavaScript auch noch nicht gibt. Klassenelemente stehen direkt über die Klasse zur Verfügung und nicht über eine Instanz. Das heißt, wenn eine Klasse "Rectangle" hier ein static-Element deklariert, greift man über den Namen der Klasse, also "Rectangle", direkt auf dieses static-Element, in diesem Fall eine Methode, zu. Wenn diese Methode einen Rückgabewert liefert, etwa ein Objekt, dann kann man auch weiter über die Objekteigenschaften vorgehen. Der entscheidende Punkt ist aber, dass man hier über die Klasse selbst agiert. Wir schauen jetzt die Ausgabe von diesen Elementen, Strukturen an, denn die werden wirklich in einigen modernen Engines unterstützt. Sie sehen hier also die "30", das ist die Ausgabe allgemeineForm.x. Das ist diese "30" hier, die dem Konstruktor übergeben wird. Dann benutze ich die toString()-Ausgabe. Dann nehme ich den Wert von "radius" von dem Kreis, das sind hier diese "100". Dann nehme ich die überschriebene Methode von "kreis", also "toString" wurde ja dort überschrieben. Die nächste Ausgabe ist der Zugriff auf das static-Element, und dann werten wir noch einmal die Fläche aus über einen getter, hier dieses "get flaeche". Sie sehen also an der Ausgabe hier in Chrome, dass diese gesamten Techniken bereits sehr zuverlässig funktionieren, sofern wir eine neue Engine haben und alles wiedergeben, was man in Bezug auf Vererbung, auf Klassenelemente aus modernen Programmiersprachen, wie Java oder C#, bereits kennt.

OOP mit JavaScript Grundkurs

Sehen Sie, wie Sie mit JavaScript objektorientiert programmieren können.

3 Std. 8 min (35 Videos)
Derzeit sind keine Feedbacks vorhanden...
Software:
Exklusiv für Abo-Kunden
Erscheinungsdatum:09.03.2017

Dieser Online-Kurs ist als Download und als Streaming-Video verfügbar. Die gute Nachricht: Sie müssen sich nicht entscheiden - sobald Sie das Training erwerben, erhalten Sie Zugang zu beiden Optionen!

Der Download ermöglicht Ihnen die Offline-Nutzung des Trainings und bietet die Vorteile einer benutzerfreundlichen Abspielumgebung. Wenn Sie an verschiedenen Computern arbeiten, oder nicht den ganzen Kurs auf einmal herunterladen möchten, loggen Sie sich auf dieser Seite ein, um alle Videos des Trainings als Streaming-Video anzusehen.

Wir hoffen, dass Sie viel Freude und Erfolg mit diesem Video-Training haben werden. Falls Sie irgendwelche Fragen haben, zögern Sie nicht uns zu kontaktieren!