Komposition kontra arv
Föredra komposition för delade beteenden.
Komposition kontra arv är en gratis lektion i Angular Academy på CoddyKit. Detta är lektion 4 av 4. Du kan läsa vilka 3 lektioner som helst i den här lärvägen kostnadsfritt i sin helhet – därefter låser CoddyKit PRO upp alla lektioner, plus praktisk övning med en inbyggd kodredigerare och en AI-lärare dygnet runt. Den ingår i lärvägen för Angular Academy, och Era framsteg synkroniseras mellan webben och CoddyKit-appen. Kursen i Angular Academy innehåller totalt 4 lektioner.
Två strategier för återanvändning
För att dela beteenden mellan komponenter kan ni använda arv (utöka en basklass) eller sammansättning (kombinera mindre delar). Angulars sammansättnings-API gör sammansättning till det rekommenderade standardvalet.
Sammanfattning av arv
Med arv utökar en komponent en baskomponent eller ett basdirektiv och återanvänder dess inputs, outputs och logik.
export class FancyButton extends BaseButton {
// inherits BaseButton members
}Begränsningar med arv
En klass kan endast utöka en basklass. Djupa hierarkier blir stela, och ni ärver allt, även delar ni inte vill ha.
Diamantproblemet
Det går inte att kombinera flera beteenden med arv utan besvärliga kedjor. Sammansättning kringgår detta genom att tillämpa många direktiv oberoende av varandra.
Sammanfattning av sammansättning
Med sammansättning förblir en komponent fokuserad och hämtar in beteenden via hostDirectives, där ni kan blanda in så många som behövs.
hostDirectives: [ElevateDirective, RippleDirective, FocusTrapDirective]Föredra sammansättning
Riktlinjen "föredra sammansättning framför arv" gäller i hög grad i Angular: sammansättning är flexibel, utbyggbar och undviker bräckliga basklasser.
När arv fortfarande passar
Arv kan vara lämpligt för en enda stabil bas som delas av nära besläktade varianter, till exempel ett basfält för formulär som varianterna specialiserar. Håll hierarkierna grunda.
Kombinera båda
Ni kan kombinera metoderna: utöka en tunn bas för gemensam struktur och sätt samman beteenden för övergripande funktioner.
Inkapsling
Sammansättning håller varje beteendes interna delar privata och exponerar endast utvalda inputs och outputs, medan arv exponerar hela basens API.
Refaktorera mot sammansättning
När en basklass samlar på sig orelaterade ansvarsområden kan ni dela upp varje del i ett direktiv och sätta samman dem. Resultatet blir mer modulärt och testbart.
Vägledning för valet
Behöver ni flera oberoende beteenden? Använd sammansättning. Behöver ni en enda gemensam strukturell grund? Då kan en grund hierarki vara lämplig. Välj som standard sammansättning för större flexibilitet.
Snabbtest
Testa er förståelse av sammansättning jämfört med arv.
Sammanfattning
Ni har lärt er att sammansättning (att kombinera fokuserade beteenden via hostDirectives) är mer flexibel än arv (en enda basklass), undviker bräckliga hierarkier och bör vara standardvalet. Använd grunt arv endast för gemensam struktur.
Lär dig HTML med en AI-lärare – gratis
Skriv och kör riktig kod i webbläsaren, få omedelbar hjälp av en AI-lärare dygnet runt och fortsätt där du slutade – på webben eller i appen.
- Kurser
- 38
- Lektioner
- 144
Vanliga frågor
Är lektionen ”Komposition kontra arv” gratis?
Ja – du kan läsa vilka 3 lektioner som helst i lärvägen Angular Academy, inklusive ”Komposition kontra arv”, kostnadsfritt i sin helhet här på webben. Därefter låser CoddyKit PRO upp alla lektioner, plus interaktiv övning med en inbyggd kodredigerare och en AI-lärare dygnet runt. Kursen i Angular Academy innehåller totalt 4 lektioner.
Vad lär jag mig i ”Komposition kontra arv”?
Föredra komposition för delade beteenden. Ni övar på Angular Academy med praktisk kod som körs direkt i webbläsaren, medan en AI-handledare som är tillgänglig dygnet runt svarar på Era frågor under lektionen.
Behöver jag någon erfarenhet för att börja lära mig Angular Academy?
Du behöver inga förkunskaper. Utbildningen i Angular Academy på CoddyKit är upplagd för allt från nybörjare till avancerade elever, så att du kan börja här eller från början och gå fram i din egen takt. Detta är lektion 4 av 4.
Hur lång tid tar lektionen ”Komposition kontra arv”?
De flesta CoddyKit-lektioner tar cirka 5–10 minuter. Varje lektion är kort och interaktiv, så att du gör stadiga framsteg och kan fortsätta precis där du slutade – på webben eller i appen.
Kan jag skriva och köra kod i den här Angular Academy-lektionen?
Ja. Varje Angular Academy-lektion innehåller en inbyggd kodredigerare, så att du kan skriva och köra riktig kod direkt i webbläsaren och få omedelbar AI-feedback – utan lokal installation.
Alla lektioner i den här kursen
- Egenskapen hostDirectives
- Exponera indata och utdata
- Bygga återanvändbara beteenden
- Komposition kontra arv