Objektorientierte Programmierung (OOP) in JavaScript: Eine Einführung in 110 Minuten // deutsch

Objektorientierte Programmierung in JavaScript, das ist nicht ganz so einfach, wie sich das viele Entwicklerinnen und Entwickler wünschen. Zu anders als die klassischen objektorientierten Sprachen wie C++, Java und C# ist JavaScript an vielen Stellen. Doch wer weiß, wie Objekte in JavaScript funktionieren, kann dennoch sehr eleganten Code schreiben. Golo Roden, Gründer und CTO der the native web GmbH, erklärt, worauf es bei der objektorientierten Programmierung in JavaScript zu achten gilt.

0:00:00 – Einleitung
0:00:54 – Was ist ein Objekt?
0:03:09 – Key-Value-Paare
0:05:43 – Objekte mit Funktionen erzeugen
0:07:28 – Listen mit verschachtelten Objekten
0:11:50 – Objekte lesbar ausgeben
0:13:40 – Objekte strukturiert erzeugen
0:14:55 – Der typeof-Operator
0:17:44 – Arrays als spezielle Objekte
0:22:54 – Datentypen für Keys
0:27:48 – Umgang mit privaten Daten
0:33:09 – Zwischenfazit #1
0:34:04 – Funktionen sind Objekte
0:36:44 – Fibonacci-Zahlen berechnen
0:41:05 – Die Rekursion beschleunigen
0:44:50 – Eigenschaften für Funktionen definieren
0:47:48 – Zwischenfazit #2
0:50:11 – Zur Effizienz von Objekten
0:52:41 – Konstruktorfunktionen verwenden
0:56:51 – Der new-Operator
1:00:51 – Konventionen für Konstruktoren
1:02:37 – Konventionen (bewusst) ignorieren
1:05:52 – Das Prototyp-Objekt
1:13:59 – Daten im Prototyp speichern
1:17:05 – Statische Funktionen
1:18:11 – Zwischenfazit #3
1:21:38 – Vererbung mit Prototypen
1:22:43 – Das class-Schlüsselwort
1:26:32 – Klassen: Der Wolf im Schafspelz
1:30:03 – Vererbung mit Klassen
1:31:37 – Private Daten in EcmaScript 2022
1:34:21 – Das this-Schlüsselwort
1:49:01 – Klassen vs der funktionale Ansatz

────────────────────

Über the native web 🦄

Wir sind ein Beratungs-, Schulungs- und Entwicklungsunternehmen, das sich auf Web- und Cloud-Technologien spezialisiert hat. Wir streben nach intelligenten und eleganten Lösungen für komplexe Probleme, und wir glauben, dass Softwareentwicklung kein Selbstzweck ist. Stattdessen sollte Software tatsächliche Probleme der realen Welt lösen.

Wir glauben, dass native Web- und Cloud-Technologien das Fundament sind, auf dem die Zukunft aufbaut. Unsere Kernkompetenz ist der Entwurf und die Entwicklung verteilter Web- und Cloud-Anwendungen unter Verwendung dieser Technologien in interdisziplinären Teams. Wir entwickeln auch unser eigenes Open-Source-Framework namens wolkenkit. Und wir lieben es, unser Wissen in Schulungen und Workshops, auf Konferenzen und bei Usergroups zu teilen.

────────────────────

Weiterführende Links 🌍

[uselesscommentary]

Ich kann mittlerweile einfach nur danke sagen! Jedes Mal aufs Neue so viel Inhalt in einem Video. Leider hab ich diesen Kanal erst sehr spät entdeckt, aber lieber später als nie.

[devchannel]

Ich kann mich den meisten Kommentaren nur anschließen. Ihr seid der Hammer!!! Danke für die regelmäßig großartigen Videos! Ihr gehört mittlerweile zu meinem täglichen Pflichtprogramm.

[MarkusDoedt]

Danke! Habe viel Neues gelernt! Unglaublich tolles Video!

[besidesdepersonalise]

Ich liebe diese Reihe ❤️ TDD Docker Kubernetes …

[domemvs]

Ich freue mich schon auf einen so qualitativ hochwertigen Content rund um Go!

[ikemkrueger]

Das war die beste Javascript Zusammenfassung, die ich bis jetzt gesehen habe. Wird weiterempfohlen. Vielen Dank dafür. Was ich für mich mitgenommen habe: Bei „new“, das versteckte mitgeben von „{}“ als „this“ und das anhängen von Variablen und Funktionen daran, den Unterschied von „call“ „commas“ und „apply“ „array“ und die unterschiedlichen Varianten von „this“.

[michaelrichter]

Super Video zu JavaScript und OOP. Vor allen die Fallstricke zum Thema this sind super erklärt.Vielen Dank.

[psychedelic-chi]

Erst jetzt wird mir einiges dank deiner Hilfe klar. Tolles Video zum Thema js OOP. Herlichen Dank!

[sinorteka]

Tolle Informationen. Das ist ja schon ein Kompendium. Auch die Randinfos wie cdr cda und NullType Bug in JavaScript sowie Prototype sind interessant. Das erste mal, dass ich den „Thanks$“ Button gedrückt habe. Vielen vielen Dank.

[marinaegner]

Wieder ein tolles Video! Danke! 😊
Mir wird damit einiges klarer! 😊
Ich mag den funktionalen Ansatz insgesamt auch besser und finde mich gerne damit ab, dass es eben keine C-Sprache ist. Das mag ich sogar irgendwie daran.

[bobbymarley]

Vielen Dank für Dein sehr spannendes und informatives Video. 😊
In diesem Video konnte ich doch einiges auffrischen und dazu lernen.
Jetzt finde ich auch das JaveScript "this" etwas weniger gruselig. 😁

[stevenkleist]

Vielen Dank für das Video, gerade bei den Eigenheiten von `this` war ich mir doch nicht so sicher. Mit dem OOP Ansatz und den Prototypen von JavaScript und Lua komme ich aber tatsächlich besser klar als mit dem "klassischen" Ansatz von C++, C#, Java. Generell liegen mir die Ansätze abseits des klassischen OOP mehr, gute Beispiele dafür sind auch C und Go. Es lohnt sich auf jeden Fall OOP in diesen beiden Sprachen anzusehen.

[Patrick-fswh]

Ich habe erst vor kurzem angefangen, mich mit dem Thema Webentwicklung zu beschäftigen und bin dadurch zufällig auf deinen Kanal gestoßen. Ich wollte mich einfach mal bei dir bedanken für den ganzen Content, den du uns zur Verfügung stellst. Vor allem macht es mega Spaß dir dabei zuzuhören und ich habe in so kurzer Zeit so viel von dir gelernt! Einfach mega, Danke!!

[christianhorauf]

Neu war für mich, dass man mit dem new Operator ein beliebiges Objekt zurück geben kann.👍

[sephentos]

Vielen lieben Dank für dieses informative Video!

[arneweber]

Bin langjähriger javascript Entwickler und muss zugeben, ich erfahre in jedem Deiner Videos einiges Neues. Gerade die OO Thematik war immer so eine unklare Geschichte. Wie ist es denn nun richtig? Warum per keyword class, warum nicht? ... und so wuchs der Code historisch mehr oder weniger gut.
Hintergrundinformationen und teilweise nur beiläufig erwähnte Sachverhalte bringen mich in Deinen Videos oft auf neue Spuren. Dann schaut man eben doch mal in die node.js, typescript usw. Ecke, auch wenn das gerade nicht aktuelles Entwicklungsthema ist.
Fragezeichen die beim Schauen der Videos entstehen, werden dann auch kurz darauf geklärt. Dieser Punkt ist bei anderen Kanälen teilweise unbefriedigend.

[hannes]

Richtige geile Videos und Erklärungen :D danke vielmals. Wie hast du bei 1:40:30 die ganzen private hashtags # markiert und gelöscht?

[BenjaminAster]

1:32:04 Um Variablen in VSCode umzubenennen, kann man einfach F2 drücken.

[Lyrik-Klinge]

Meine Mutter sagte immer, man solle nicht fluchen...
Ich mache es hier trotzdem: VERDAMMT gute Vermittlungskompetenz bei gutem Unterhaltungscharakter!

[longingbydesign]

Ich würde wirklich gern mal ein ausführliches Video zum Konzept und zur praktischen Anwendung von OLOO (Objects linked to other objects) als Alternative zur Vererbung sehen.