Vi har kommet langt i å lære TypeScript siden starten av denne serien. Den første opplæringen ga deg en kort introduksjon til TypeScript og foreslo noen IDEer du kan bruke til å skrive TypeScript. Den andre opplæringen fokuserte på datatyper, og den tredje opplæringen diskuterte grunnleggende grensesnitt i TypeScript.
Som du kanskje allerede vet, har JavaScript bare nylig lagt til opprinnelig støtte for klasser og objektorientert programmering. TypeScript har imidlertid tillatt utviklere å bruke klasser i sin kode i lang tid. Denne koden blir deretter samlet til JavaScript som vil fungere over alle de store nettleserne. I denne opplæringen lærer du om klasser i TypeScript. De ligner på sine ES6-kolleger, men er strengere.
La oss starte med det grunnleggende. Klasser er en grunnleggende del av objektorientert programmering. Du bruker klasser til å representere alle enheter som har noen egenskaper og funksjoner som kan fungere på bestemte egenskaper. TypeScript gir deg full kontroll over egenskapene og funksjonene som er tilgjengelige innenfor og utenfor egen klasse. Her er et veldig grunnleggende eksempel på å skape en Person
klasse.
Klasse Person navn: streng; konstruktør (theName: streng) this.name = theName; introducér selv () console.log ("Hei, jeg er" + dette.navnet + "!"); la personA = ny person ("Sally"); personA.introduceSelf ();
Ovennevnte kode skaper en veldig enkel klasse som heter Person
. Denne klassen har en eiendom som kalles Navn
og en funksjon som kalles introduceSelf
. Klassen har også en konstruktør, som også i utgangspunktet er en funksjon. Konstruktører er imidlertid spesielle fordi de kalles hver gang vi lager en ny forekomst av vår klasse.
Du kan også sende parametere til konstruktører for å initialisere forskjellige egenskaper. I vårt tilfelle bruker vi konstruktøren til å initialisere navnet på personen vi oppretter ved hjelp av Person
klasse. De introduceSelf
funksjon er en metode for Person
klassen, og vi bruker den her til å skrive ut navnet på personen til konsollen. Alle disse egenskapene, metodene og konstruktøren til en klasse er kollektivt kalt klassemedlemmer.
Du bør huske på at Person
Klassen lager ikke automatisk en person av seg selv. Det virker mer som en tegning med all informasjon om attributter en person burde ha en gang opprettet. Med det i tankene opprettet vi en ny person og kalte henne Sally. Ringer metoden introduceSelf
På denne personen vil du skrive ut linjen "Hei, jeg er Sally!" til konsollen.
I den forrige delen opprettet vi en person som heter Sally. For øyeblikket er det mulig å endre navnet på personen fra Sally til Mindy hvor som helst i vår kode, som vist i følgende eksempel.
Klasse Person navn: streng; konstruktør (theName: streng) this.name = theName; introducér selv () console.log ("Hei, jeg er" + dette.navnet + "!"); la personA = ny person ("Sally"); // Utskrifter "Hei, jeg er Sally!" personA.introduceSelf (); personA.name = "Mindy"; // Skrifter "Hei, jeg er Mindy!" personA.introduceSelf ();
Du har kanskje lagt merke til at vi var i stand til å bruke begge Navn
eiendom og introduceSelf
metode utenfor den inneholdende klassen. Dette skyldes at alle medlemmene av en klasse i TypeScript er offentlig
som standard. Du kan også spesifikt angi at en eiendom eller metode er offentlig ved å legge til søkeordet offentlig
før det.
Noen ganger vil du ikke ha en eiendom eller metode for å være tilgjengelig utenfor den som inneholder klassen. Dette kan oppnås ved å gjøre disse medlemmene private ved hjelp av privat
søkeord. I ovennevnte kode kan vi gjøre navnet på eiendommen privat
og hindre at den endres utenfor den inneholdende klassen. Etter denne endringen vil TypeScript vise deg en feil som sier at Navn
eiendommen er privat
og du kan bare få tilgang til den inne i Person
klasse. Skjermbildet nedenfor viser feilen i Visual Studio-koden.
Arv gir deg mulighet til å lage mer komplekse klasser fra en grunnklasse. For eksempel kan vi bruke Person
klasse fra forrige seksjon som en base for å lage en venn
klasse som vil ha alle medlemmene av Person
og legg til noen egne medlemmer. På samme måte kan du også legge til en Familie
eller Lærer
klasse.
De vil alle arve metodene og egenskapene til Person
mens du legger til noen metoder og egenskaper for å sette dem fra hverandre. Følgende eksempel skal gjøre det tydeligere. Jeg har også lagt til koden for Person
klasse her, slik at du enkelt kan sammenligne koden til både grunnklassen og den avledede klassen.
klasse Person privat navn: streng; konstruktør (theName: streng) this.name = theName; introducér selv () console.log ("Hei, jeg er" + dette.navnet + "!"); klasse, venn utvider person yearsKnown: number; konstruktør (navn: streng, år, navn: tall) super (navn); this.yearsKnown = yearsKnown; timeKnown () console.log ("Vi har vært venner for" + this.yearsKnown + "years.") la vennA = ny venn ("Jacob", 6); // Utskrifter: Hei, jeg er Jacob! friendA.introduceSelf (); // Utskrifter: Vi har vært venner i 6 år. friendA.timeKnown ();
Som du kan se, må du bruke forlenge
søkeord for venn
klasse for å arve alle medlemmene av Person
klasse. Det er viktig å huske at konstruktøren av en avledet klasse alltid skal påkalle konstruktøren til baseklassen med en samtale til super()
.
Du har kanskje lagt merke til at konstruktøren til venn
trengte ikke å ha samme antall parametere som grunnklassen. Imidlertid ble førsteparameteren passert til super()
for å påberope konstruktøren til foreldrene, som også aksepterte en parameter. Vi måtte ikke omdefinere introduceSelf
fungere inne i venn
klassen fordi den var arvet fra Person
klasse.
Opptil dette punktet har vi bare gjort medlemmene av en klasse heller privat
eller offentlig
. Mens de gjør dem offentlige, kan vi få tilgang til dem fra hvor som helst, slik at medlemmene private begrenser dem til egen klasse. Noen ganger vil du kanskje at medlemmene av en grunnklass skal være tilgjengelig i alle de avledede klassene.
Du kan bruke beskyttet
modifikator i slike tilfeller for å begrense tilgangen til et medlem bare til avledede klasser. Du kan også bruke beskyttet
søkeord med konstruktøren til en grunnklasse. Dette forhindrer at noen oppretter en forekomst av den klassen. Du vil imidlertid fortsatt kunne utvide klasser basert på denne grunnklassen.
klasse Person privat navn: streng; beskyttet alder: antall; beskyttet konstruktør (theName: streng, theAge: tall) this.name = theName; this.age = theAge; introducér selv () console.log ("Hei, jeg er" + dette.navnet + "!"); klasse, venn utvider person yearsKnown: number; konstruktør (navn: streng, alder: antall, årKjenn: tall) super (navn, alder); this.yearsKnown = yearsKnown; timeKnown () console.log ("Vi har vært venner for" + this.yearsKnown + "years.") friendSince () la firstAge = this.age - this.yearsKnown; console.log ('Vi har vært venner siden jeg var $ firstAge år gammel.') la vennA = ny venn ("William", 19, 8); // Utskrifter: Vi har vært venner siden jeg var 11 år gammel. friendA.friendSince ();
I ovennevnte kode kan du se at vi laget alder
eiendom beskyttet
. Dette forhindrer bruken av alder
utenfor noen klasser avledet fra Person
. Vi har også brukt beskyttet
søkeord for konstruktøren av Person
klasse. Deklarere konstruktøren som beskyttet
betyr at vi ikke lenger kan direkte instantiere Person
klasse. Følgende skjermbilde viser en feil som dukker opp mens du prøver å ordne en klasse med beskyttet
konstruktør.
I denne opplæringen har jeg forsøkt å dekke grunnleggende om klasser i TypeScript. Vi begynte opplæringen ved å lage en veldig grunnleggende Person
klasse som skrev navnet til personen til konsollen. Etter det lærte du om privat
søkeord, som kan brukes til å forhindre at medlemmene i en klasse blir tilgang til på ethvert vilkårlig punkt i programmet.
Til slutt lærte du å utvide forskjellige klasser i koden din ved hjelp av en grunnklasse med arv. Det er mye mer som du kan lære om klasser i den offisielle dokumentasjonen.
Hvis du har spørsmål relatert til denne opplæringen, gi meg beskjed i kommentarene.