Komposition vs. Vererbung
Für gemeinsames Verhalten Komposition bevorzugen
Komposition vs. Vererbung ist eine kostenlose Angular Academy-Lektion auf CoddyKit. Dies ist Lektion 4 von 4. Du kannst die komplette Lektion unten kostenlos lesen – dann übst du sie direkt im Browser mit einem integrierten Code-Editor und einem KI-Tutor rund um die Uhr. Sie ist Teil des Angular Academy-Lernpfads, und dein Fortschritt wird über Web und CoddyKit-App synchronisiert. Der Angular Academy-Kurs umfasst insgesamt 4 Lektionen.
Zwei Strategien zur Wiederverwendung
Um Verhalten zwischen Komponenten zu teilen, können Sie Vererbung (eine Basisklasse erweitern) oder Komposition (kleinere Bausteine kombinieren) verwenden. Angulars Kompositions-API macht Komposition zur bevorzugten Standardeinstellung.
Zusammenfassung der Vererbung
Bei der Vererbung erweitert eine Komponente eine Basiskomponente oder -direktive und verwendet deren Eingaben, Ausgaben und Logik wieder.
export class FancyButton extends BaseButton {
// inherits BaseButton members
}Einschränkungen der Vererbung
Eine Klasse kann nur eine Basisklasse erweitern. Tiefe Hierarchien werden schnell starr, und Sie erben alles – auch Teile, die Sie nicht benötigen.
Das Diamantproblem
Mehrere Verhaltensweisen lassen sich über Vererbung ohne umständliche Ketten nicht kombinieren. Die Komposition umgeht dieses Problem, indem sie viele Direktiven unabhängig voneinander anwendet.
Zusammenfassung der Komposition
Bei der Komposition bleibt eine Komponente fokussiert und bindet Verhaltensweisen über hostDirectives ein, wobei sie beliebig viele kombinieren kann.
hostDirectives: [ElevateDirective, RippleDirective, FocusTrapDirective]Komposition bevorzugen
Die Empfehlung "Komposition gegenüber Vererbung bevorzugen" gilt besonders für Angular: Komposition ist flexibel und erweiterbar und vermeidet fragile Basisklassen.
Wann Vererbung weiterhin sinnvoll ist
Vererbung kann für eine einzelne, stabile Basis sinnvoll sein, die von eng verwandten Varianten gemeinsam genutzt wird, etwa bei einem Basis-Formularfeld, das von Varianten spezialisiert wird. Halten Sie Hierarchien flach.
Beides kombinieren
Sie können beide Ansätze kombinieren: Erweitern Sie eine schlanke Basisklasse für gemeinsame Strukturen und kombinieren Sie Verhaltensweisen für übergreifende Belange.
Kapselung
Die Komposition hält die Interna jeder Verhaltensweise privat und gibt nur ausgewählte Eingaben und Ausgaben frei, während die Vererbung die gesamte API der Basisklasse offenlegt.
Auf Komposition umstellen
Wenn eine Basisklasse immer mehr voneinander unabhängige Verantwortlichkeiten übernimmt, teilen Sie jede davon in eine Direktive auf und kombinieren Sie diese. Das Ergebnis ist modularer und besser testbar.
Entscheidungshilfe
Benötigen Sie mehrere unabhängige Verhaltensweisen? Verwenden Sie Komposition. Benötigen Sie eine einzige gemeinsame strukturelle Grundlage? Eine flache Basisklasse kann geeignet sein. Bevorzugen Sie standardmäßig die Komposition, um flexibel zu bleiben.
Kurze Überprüfung
Testen Sie Ihr Verständnis von Komposition und Vererbung.
Zusammenfassung
Sie haben gelernt, dass Komposition (das Kombinieren fokussierter Verhaltensweisen über hostDirectives) flexibler ist als Vererbung (eine einzelne Basisklasse), fragile Hierarchien vermeidet und die Standardeinstellung sein sollte. Eine flache Vererbung bleibt gemeinsamen Strukturen vorbehalten.
Häufig gestellte Fragen
Ist die Lektion „Komposition vs. Vererbung“ kostenlos?
Ja — der vollständige Text von „Komposition vs. Vererbung“ ist hier im Web kostenlos zu lesen. Um sie interaktiv zu üben (integrierter Code-Editor und 24/7 KI-Tutor) und den Rest des Angular Academy-Kurses freizuschalten, upgrade auf CoddyKit PRO. Der Angular Academy-Kurs umfasst insgesamt 4 Lektionen.
Was lerne ich in „Komposition vs. Vererbung“?
Für gemeinsames Verhalten Komposition bevorzugen Du übst Angular Academy mit praktischem Code, den du direkt im Browser ausführst, und ein 24/7 KI-Tutor beantwortet deine Fragen während du die Lektion bearbeitest.
Brauche ich Erfahrung, um Angular Academy zu starten?
Keine Vorkenntnisse erforderlich. Angular Academy auf CoddyKit ist für Anfänger bis fortgeschrittene Lernende strukturiert, sodass du hier starten oder von Anfang an beginnen und in deinem eigenen Tempo voranschreiten kannst. Dies ist Lektion 4 von 4.
Wie lange dauert die Lektion „Komposition vs. Vererbung“?
Die meisten CoddyKit-Lektionen dauern etwa 5–10 Minuten. Jede ist kompakt und interaktiv, sodass du stetig Fortschritte machst und genau dort weitermachst, wo du aufgehört hast – im Web und in der App.
Kann ich in dieser Angular Academy-Lektion Code schreiben und ausführen?
Ja. Jede Angular Academy-Lektion enthält einen integrierten Code-Editor, sodass du echten Code direkt in deinem Browser schreibst und ausführst und sofort KI-Feedback erhältst — ohne lokale Einrichtung erforderlich.
Alle Lektionen in diesem Kurs
- Die hostDirectives-Eigenschaft
- Inputs und Outputs bereitstellen
- Wiederverwendbare Verhaltensweisen erstellen
- Komposition vs. Vererbung