JavaScript-bruker prototypal arv: hver gjenstand arver egenskaper og metoder fra dens prototype objekt.
tradisjonell klasse som blåkopi for å opprette objekter, som brukes i språk som Java eller Swift, eksisterer ikke i JavaScript. Den prototypal arv tilbud bare med objekter.
prototypal arv kan emulere den klassiske klasse arv. For å bringe den tradisjonelle klasser til JavaScript, ES2015 standard introduserer class syntaks: en syntaktisk sukker over prototypal arv.,
Dette innlegget du kjent med JavaScript klasser: hvordan definere en klasse, må du initialisere det eksempel definere felter og metoder, forstå private og offentlige felt, bør du holde i den statiske felt og metoder.
1. Definisjon: klasse søkeord
De spesielle søkeord class definerer en klasse i JavaScript:
class User { // The body of class}koden ovenfor definerer en klasse User. Den krøllparentes { } avgrense klassen kroppen. Merk at denne syntaksen er oppkalt klasse erklæring.,
Du er ikke forpliktet til å indikere klasse navn. Ved hjelp av en klasse uttrykk du kan tilordne klasse til en variabel:
const UserClass = class { // The body of class};Du kan enkelt eksportere en klasse som en del av en ES2015 modul. Her er syntaksen for en standard eksport:
export default class User { // The body of class}Og en navngitt eksport:
export class User { // The body of class}klassen blir nyttig når du oppretter en instans av klassen. Et eksempel er et objekt som inneholder data og oppførsel beskrevet av klassen.,
new operatør instantiates klassen i JavaScript: instance = new Class().
For eksempel, du kan instantiate User klassen ved hjelp av new bruker:
const myUser = new User();new User() oppretter en instans av User klasse.
2. Initialisering: constructor()
constructor(param1, param2, ...) er en spesiell metode i kroppen av en klasse som initialiserer eksempel., Det er stedet der du kan angi de opprinnelige verdiene for feltene, eller gjøre noe som helst slags objekt oppsett.
I det følgende eksemplet konstruktøren setter den første verdien i feltet name:
class User { constructor(name) { this.name = name; }}User‘s constructor har én parameter name, som er brukt for å angi den første verdien i feltet this.name.
Inne i konstruktøren this verdi er lik den nyopprettede eksempel.,
De argumentene som er brukt for å instantiate klassen blir parametrene i konstruktøren:
class User { constructor(name) { name; // => 'Jon Snow' this.name = name; }}const user = new User('Jon Snow');name parameter inne i konstruktøren har verdi 'Jon Snow'.
Hvis du ikke definere en konstruktør for klassen, en standard og en er opprettet. Standard konstruktør er en tom funksjon, som ikke endre forekomsten.
På samme tid, en JavaScript-klasse kan ha opp til en konstruktør.
3. Felt
Klasse felt er variabler som holder informasjon., Felt kan knyttes til 2 enheter:
- Felt på klasse forekomst
- Felt på klasse i seg selv (også kjent som statisk)
feltene har også 2 nivåer for tilgjengelighet:
- Offentlig: feltet er tilgjengelig hvor som helst
- Privat: feltet er bare tilgjengelig i kroppen av klasse
3.1 Offentlige eksempel felt
La oss igjen se på den forrige kodebit:
class User { constructor(name) { this.name = name; }}uttrykket this.name = name oppretter en forekomst feltet name og gir det en startverdi.,
Senere kan du få tilgang name – feltet ved hjelp av en eiendel accessor:
const user = new User('Jon Snow');user.name; // => 'Jon Snow'name er en offentlig feltet fordi du kan få tilgang til den utsiden av User klasse kroppen.
Når feltene er opprettet implisitt inne i konstruktøren, som i forrige scenario, kan det være vanskelig å ta tak i felt-listen. Du har å holde styr på dem fra constructor kode.
En bedre tilnærming er å uttrykkelig erklærer klassen felt., Uansett hva konstruktøren gjør, forekomst alltid har de samme feltene.
klassen felt forslaget lar deg definere feltene inne i kroppen av klassen. Plus, kan du angi startverdi med en gang:
class SomeClass { field1; field2 = 'Initial value'; // ...}La oss endre User klasse og erklære en offentlig feltet name:
class User { name; constructor(name) { this.name = name; }}const user = new User('Jon Snow');user.name; // => 'Jon Snow'name; inne i kroppen av klasse erklærer en offentlig feltet name.,
Den offentlige felt erklært en slik måte at det er uttrykksfulle: en rask titt på feltene erklæringer er nok til å forstå class data struktur.
Videre, klasse-feltet kan være initialisert med en gang ved erklæring.
class User { name = 'Unknown'; constructor() { // No initialization }}const user = new User();user.name; // => 'Unknown'name = 'Unknown' i klasse kroppen erklærer et felt name og initialiseres det med verdi 'Unknown'.
Det er ingen begrensning på tilgang eller oppdatering av offentlige felt., Du kan lese og tilordne verdier til offentlige felt inne i konstruktøren, metoder og utenfor klassen.
3.2 Privat eksempel felt
Innkapsling er et viktig konsept som gjør at du kan skjule interne detaljer for en klasse. Noen som bruker en innkapslet klasse avhenger kun på de offentlige grensesnitt som klassen gir, og ikke par til gjennomføring detaljer av klassen.
Klasser organisert med innkapsling i tankene er enklere å oppdatere når gjennomføringen detaljene du vil endre.,
En god måte å skjule interne data på et objekt på, er å bruke eget felt. Dette er feltene som kan leses og endres bare innen den klasse de tilhører. Verden utenfor klassen kan ikke endre eget felt direkte.
Den private felt er kun tilgjengelig i kroppen av klassen.
Prefiks feltet navn med den spesielle symbol # for å gjøre det privat, f.eks. #myField., Prefikset # må holdes hver gang du arbeider med felt: erklære den, les den, eller endre det.
La oss sørge for at feltet #name kan settes i gang på initiativ initialisering:
#name er et eget felt. Du kan få tilgang til og endre #name i kroppen av User. Metoden getName() (mer om metoder i neste avsnitt) kan få tilgang til den private felt #name.,
Men hvis du prøver å få tilgang til den private felt #name utsiden av User klasse kroppen, en syntaks-feil er kastet: SyntaxError: Private field '#name' must be declared in an enclosing class.
3.3 Offentlige statiske felt
Du kan også angi felt på klasse i seg selv: den statiske felt. Dette er nyttig for å definere klasse konstanter eller lagre informasjon som er spesifikk for klassen.
for Å lage statiske felt i en JavaScript-klasse, kan du bruke spesielle søkeord static etterfulgt av feltet navn: static myStaticField.,
La oss legge til et nytt felt type indikerer at brukeren skriver: admin eller regelmessig. Den statiske felt TYPE_ADMIN og TYPE_REGULAR er nyttige konstanter for å skille mellom brukeren typer:
static TYPE_ADMIN og static TYPE_REGULAR angi statisk variabler inne i User klasse. For å få tilgang til den statiske felt, må du bruke klassen etterfulgt av feltet navn: User.TYPE_ADMIN og User.TYPE_REGULAR.
3.,4 Private statiske felt
noen Ganger selv de statiske felt er en implementering detaljer som du ønsker å skjule. I denne forbindelse, kan du gjøre statiske felt private.
for Å gjøre den statiske felt private, prefiks feltet navn med # spesielle symboler: static #myPrivateStaticField.
La oss si at du ønsker å begrense antallet forekomster av User klasse., For å skjule detaljer om forekomster grenser, kan du opprette egen statiske felt:
Den statiske felt User.#MAX_INSTANCES angir maksimalt antall tillatte forekomster, mens User.#instances statisk felt teller faktisk antall tilfeller.
Disse private statiske felt er kun tilgjengelig i User klasse. Ingenting fra den ytre verden kan forstyrre grenser mekanisme: det er fordel for innkapsling.
4. Metoder
feltene holde data., Men evnen til å endre data er utført av spesielle funksjoner som er en del av klassen: de metoder.
JavaScript-klasser støtte både forekomst og statiske metoder.
4.1 Forekomst metoder
Eksempel metoder kan få tilgang til og endre eksempel data. Eksempel metoder kan ringe andre forekomsten metoder, samt eventuell statisk metode.,
For eksempel, la oss definere en metode getName() som returnerer navnet i User class:
I en klasse metode, så vel som i constructor, this verdi tilsvarer klasse forekomst. Bruk this for å få tilgang til forekomst av data: this.field, eller du kan selv ringe til andre metoder: this.method().,
La oss legge til en ny metode nameContains(str) som har én parameter, og kaller opp en annen metode:
nameContains(str) { ... } er en metode for User klasse som aksepterer en parameter str. Mer enn det, det kjører en annen metode for eksempel this.getName() for å få brukernavnet.
En metode kan også være private. For å gjøre metoden eget prefiks sitt navn med #.
La oss gjøre getName() metode privat:
#getName() er en egen metode., Inne i metoden nameContains(str) du ringer til en egen metode slik måte: this.#getName().
å Være privat, #getName() kan ikke bli kalt utenfor User klasse kroppen.
4.2 Getters og bidra
getter og setter etterligner vanlig feltet, men med mer kontroll på hvordan feltet er åpnet og endret.
getter er utført på et forsøk på å få felt verdi, mens du setter på et forsøk på å angi en verdi.,
for Å være sikker på at name egenskap av User kan ikke være tomt, la oss bryte det private feltet #nameValue i en getter og setter:
get name() {...} getter utføres når du tilgang verdien for feltet: user.name.
4.3 Statiske metoder
Den statiske metoder er funksjoner som er koblet direkte til klassen. De holder logikk knyttet til klasse, snarere enn til forekomst av klassen.,
for Å lage en statisk metode bruk den spesielle søkeord static etterfulgt av en vanlig metode syntaks: static myStaticMethod() { ... }.
Når du arbeider med statiske metoder, det er 2 enkle regler å huske på:
- En statisk metode kan få tilgang til statiske felt
- En statisk metode ikke tilgang til forekomst felt.
For eksempel, la oss lage en statisk metode som oppdager om en bruker med et bestemt navn allerede var tatt.,
isNameTaken() er en statisk metode som bruker den statiske eget felt User.#takenNames for å sjekke tatt navn.
5. Arv: forlenger
klassene i JavaScript-støtte, enkel arv ved å bruke extends søkeord.
I uttrykket class Child extends Parent { } Child klassen arver fra Parent konstruktøren, felt og metoder.
For eksempel, la oss lage et nytt barn klasse ContentWriter som strekker overordnet klasse User.,
ContentWriter arver fra User konstruktøren, metoden getName() og feltet name. Så vel, ContentWriter klasse erklærer en ny feltet posts.
Merk som privat medlemmer av en forelder klasse er ikke arvet av barnet klasse.
5.1 Overordnede konstruktør: super() i constructor()
Hvis du ønsker å ringe foreldrene konstruktør et barn klasse, må du bruke super() spesielle funksjonen tilgjengelig i barnet constructor.,
For eksempel, la oss gjøre ContentWriter constructor ringe foreldrene konstruktør av User, så vel som initialisere innlegg feltet:
super(name) i barnet klassen ContentWriter utfører konstruktøren av den overordnede klasse User.
Merk at inni barnet konstruktøren må du kjøre super() før du bruker this søkeord. Ringer super() sørger for at den overordnede constructor initialiserer eksempel.,
class Child extends Parent { constructor(value1, value2) { // Does not work! this.prop2 = value2; super(value1); }}5.2 Overordnet instans: super i metoder
Hvis du ønsker å få tilgang til den overordnede metoden innsiden av et barn som metode, kan du bruke spesielle snarvei super.
getName() av barnet klassen ContentWriter tilgang metoden super.getName() direkte fra den overordnede klasse User.
Denne funksjonen kalles metoden overordnede.
Merk at du kan bruke super med statiske metoder for å få tilgang til foreldrenes statiske metoder.
6., Object type checking: instanceof
object instanceof Class is the operator that determines if object is an instance of Class.
Let’s see instanceof operator in action:
user is an instance of User class, user instanceof User evaluates to true.
The empty object {} is not an instance of User, correspondingly obj instanceof User is false.,
instanceof er polymorf: operatør oppdager et barn som en forekomst av den overordnede klasse.
writer er en forekomst av barnet klassen ContentWriter. Operatøren writer instanceof ContentWriter beregner true.
På samme tid ContentWriter er et barn klasse av User. Så writer instanceof User beregner true så godt.
Hva hvis du ønsker å finne ut den nøyaktige klasse for eksempel?, Du kan bruke constructor eiendom og sammenligne direkte med klassen:
writer.constructor === ContentWriter; // => truewriter.constructor === User; // => false7. Klasser og prototyper
jeg må si at klassen syntaks i JavaScript gjør en god jobb til abstrakt fra prototypal arv. For å beskrive class syntaks jeg har ikke selv brukt begrepet prototype.
Men klassene er bygget på toppen av prototypal arv. Hver klasse er en funksjon, og skaper en forekomst når påberopt som en konstruktør.
følgende to kodebiter er tilsvarende.,
klassen versjon:
Den versjonen du bruker prototype:
klassen syntaks er langt enklere å jobbe hvis du er kjent med den klassiske arv mekanisme av Java eller Swift-språk.
Anyways, selv om du bruker klasse syntaks i JavaScript, anbefaler jeg deg å ha en god forståelse av prototypal arv.
8. Klasse funksjoner tilgjengelighet
klassen har presentert i dette innlegget er spredt over ES2015 og forslag på trinn 3.,
Ved utgangen av 2019, klasse funksjoner er delt mellom:
- Offentlig og privat eksempel feltene er en del av Klassen felt forslaget
- Privat eksempel metoder og accessors er en del av Klassen privat metoder forslaget
- Offentlig og privat statiske felt og private static metoder er en del av Klassen statiske funksjoner forslaget
- resten er en del av ES2015 standard.
9. Konklusjon
JavaScript-klasser initialisere tilfeller med konstruktører, definere felter og metoder., Du kan legge ved felter og metoder selv om klassen selv ved hjelp av static søkeord.
Arv oppnås ved bruk av extends søkeord: du kan enkelt lage et barn klasse fra en forelder. super søkeord brukes til å få tilgang til den overordnede klasse fra et barn klasse.
for Å dra nytte av innkapsling, kontroller feltene og metoder privat for å skjule interne detaljer av klasser. Eget felt og metoder navn må begynne med #.,
klassene i JavaScript bli mer og mer praktisk å bruke.
Hva tror du om å bruke # for å prefiks private eiendommer?