JavaScript käyttää prototypal perintö: jokainen objekti perii ominaisuuksia ja menetelmiä sen prototyyppi esine.
perinteistä luokkaa, sillä Javan tai Swiftin kaltaisilla kielillä käytettyjä objektien luomistapoja ei ole Javascriptissä. Prototyyppiperintö käsittelee vain esineitä.
prototyyppiperintö voi jäljitellä klassista luokkaperintöä. Tuo perinteinen luokat JavaScript, ES2015 standardi esittelee class
syntax: syntaktinen sokeri yli prototypal perintö.,
tämä viesti tutustuttaa JavaScript-tunneilla: kuinka määritellä luokka, alustaa instanssi, määritellä kentät ja menetelmät, ymmärtää yksityisiä ja julkisia kenttiä, tarttua staattisiin kenttiin ja menetelmiin.
1. Määritelmä: luokan avainsanan
erityinen avainsana class
määritellään luokan JavaScript:
class User { // The body of class}
yllä Oleva koodi määrittelee luokan User
. Kihara hammasraudat { }
rajaa luokkarungon. Huomaa, että tämän syntaksin nimi on class declaration.,
sinun ei tarvitse ilmoittaa luokan nimeä. Käyttämällä luokan ilmaus voit määrittää luokan muuttuja:
const UserClass = class { // The body of class};
Voit helposti viedä luokan osana ES2015 moduuli. Tässä on syntaksi default vienti:
export default class User { // The body of class}
Ja nimetty vienti:
export class User { // The body of class}
luokka tulee hyödyllinen, kun luodaan luokan ilmentymä. Instanssi on objekti, joka sisältää luokan kuvaamaa dataa ja käyttäytymistä.,
new
operaattori instantiates luokan JavaScript: instance = new Class()
.
esimerkiksi, voit instanssia User
class käyttäen new
käyttäjä:
const myUser = new User();
new User()
luo esimerkiksi User
luokka.
2. Alustus: rakentaja()
constructor(param1, param2, ...)
on erityinen menetelmä kehossa luokka, joka alustaa esimerkiksi., Se on paikka, jossa asetat alkuarvot kentät, tai tehdä minkäänlaista objekti asetukset.
seuraavassa esimerkissä konstruktori asettaa alkuarvo kenttä name
:
class User { constructor(name) { this.name = name; }}
User
’s rakentaja on yksi parametri name
, jota käytetään asettaa alkuarvo kenttä this.name
.
rakentajan sisällä arvo vastaa vasta luotua instanssia.,
perustelut instantiate luokan tullut parametrit rakentaja:
class User { constructor(name) { name; // => 'Jon Snow' this.name = name; }}const user = new User('Jon Snow');
name
parametri sisällä rakentaja on arvo 'Jon Snow'
.
Jos luokalle ei määritellä rakentajaa, syntyy oletusarvo. Oletuskonstruktori on tyhjä funktio, joka ei muokkaa instanssia.
samaan aikaan JavaScript-luokassa voi olla jopa yksi rakentaja.
3. Kentät
Luokkakentät ovat muuttujia, joilla on tietoa., Kenttiä voidaan liittää 2 yhteisöt:
- Kentät luokka esimerkiksi
- Kentät luokka itse (aka staattinen)
– kentät, myös on 2 tasoa saavutettavuus:
- Public: kenttä on käytettävissä mistä tahansa
- Yksityinen: kenttä on käytettävissä vain kehossa luokka
3.1 Yleisen oikeusasteen kentille
katsotaanpa uudelleen edellisen koodinpätkä:
class User { constructor(name) { this.name = name; }}
lauseke this.name = name
luo esimerkiksi kenttä name
ja määrittää sen alkuarvo.,
Myöhemmin voit käyttää name
kenttä käyttämällä accessor omaisuutta:
const user = new User('Jon Snow');user.name; // => 'Jon Snow'
name
on julkinen kenttä, koska voit käyttää sitä ulkopuolella User
luokan elin.
kun kentät luodaan implisiittisesti rakentajan sisälle, kuten edellisessä skenaariossa, kenttäluetteloa voi olla vaikea hahmottaa. Sinun täytyy tulkita ne konstruktorin koodista.
parempi lähestymistapa on ilmoittaa luokkakentät yksiselitteisesti., Riippumatta siitä, mitä constructor tekee, instanssissa on aina samat kentät.
luokkakenttäehdotuksen avulla voit määritellä luokan rungon sisällä olevat kentät. Plus, voit ilmoittaa alkuarvo heti:
class SomeClass { field1; field2 = 'Initial value'; // ...}
katsotaanpa muuttaa User
luokan ja julistaa julkinen kenttä name
:
class User { name; constructor(name) { this.name = name; }}const user = new User('Jon Snow');user.name; // => 'Jon Snow'
name;
kehossa luokan vakuuttaa, julkinen kenttä name
.,
julkiset kentät julisti tällainen tapa on ilmeikäs: vilkaista kentät ilmoitukset on tarpeeksi ymmärtää, että luokka on tietorakenne.
lisäksi luokkakenttä voidaan alustaa heti julistuksessa.
class User { name = 'Unknown'; constructor() { // No initialization }}const user = new User();user.name; // => 'Unknown'
name = 'Unknown'
sisällä luokan kehon vakuuttaa kenttä name
ja alustaa sen arvo 'Unknown'
.
julkisille kentille pääsyä tai päivittämistä ei ole rajoitettu., Voit lukea ja määrittää arvoja julkisille kentille rakentajan, menetelmien ja luokan ulkopuolella.
3.2 Yksityisen esimerkiksi kentille
Kapselointi on tärkeä käsite, jonka avulla voit piilottaa sisäisiä yksityiskohtia luokan. Joku, joka käyttää kapseloitu luokka riippuu vain julkisen käyttöliittymän, että luokka tarjoaa, ja ei pari täytäntöönpanon yksityiskohtia luokan.
Luokat järjestetään kapselointi mielessä, on helpompi päivittää, kun toteutuksen yksityiskohdat muuttuvat.,
hyvä tapa piilottaa kohteen sisäinen data on käyttää yksityisiä kenttiä. Näitä kenttiä voi lukea ja muuttaa vain sen luokan sisällä, johon ne kuuluvat. Luokan ulkopuolinen maailma ei voi suoraan muuttaa yksityisiä kenttiä.
yksityisille kentille pääsee vain luokan sisällä.
Etuliite-kenttään nimi, jonka erityinen symboli #
tehdä siitä yksityisen, esim. #myField
., Etuliite #
on säilytettävä aina, kun työskentelet kentän kanssa: ilmoita se, lue se tai muokkaa sitä.
katsotaanpa varmista, että kentässä #name
voidaan asettaa kerran esimerkiksi alustus:
#name
on oma kenttä. Voit käyttää ja muokata #name
kehossa User
. Menetelmä getName()
(lisää menetelmiä. seuraava kohta) voivat käyttää yksityinen kenttä #name
.,
Mutta, jos yrität käyttää yksityinen kenttä #name
ulkopuolella User
luokan elin, syntaksi virhe on heitetty: SyntaxError: Private field '#name' must be declared in an enclosing class
.
3.3 julkiset staattiset kentät
voit myös määritellä kentät itse luokassa: staattiset kentät. Nämä ovat hyödyllisiä määritellä luokan vakiot tai tallentaa tietonsa luokan.
Voit luoda staattisia kenttiä JavaScript-luokka, käytä erityistä avainsana static
seuraa kentän nimi: static myStaticField
.,
lisätään uusi kenttä type
, joka ilmaisee käyttäjätyypin: admin tai regular. Staattiset kentät TYPE_ADMIN
ja TYPE_REGULAR
vakiot ovat käteviä erottaa käyttäjä:
static TYPE_ADMIN
ja static TYPE_REGULAR
määritä staattinen muuttujat sisälle User
luokka. Käyttää staattisia kenttiä, sinun täytyy käyttää class seuraa kentän nimi: User.TYPE_ADMIN
ja User.TYPE_REGULAR
.
3.,4 Private static fields
joskus staattiset kentät ovat toteutuksen yksityiskohta, jonka haluaisi piilottaa. Tässä suhteessa voit tehdä staattiset kentät yksityisiksi.
Jotta staattinen kenttä on yksityinen, etuliite-kenttään nimi, jossa #
erityiset symboli: static #myPrivateStaticField
.
oletetaan, että haluat rajoittaa määrä tapauksia User
luokka., Piilottaa tietoja tapauksissa rajoja, voit luoda yksityisen staattiset kentät:
staattinen kenttä User.#MAX_INSTANCES
asettaa enimmäismäärä sallittu tapauksissa, kun User.#instances
staattinen kenttä lasketaan todellinen määrä tapauksia.
näihin yksityisiin staattisiin kenttiin pääsee vain User
– luokassa. Mitään ulkoisesta maailmasta voi häiritä rajat mekanismi: se on etu, kapselointi.
4. Menetelmät
kentät pitävät tiedot., Mutta kyky muokata tietoja suoritetaan erityisiä toimintoja, jotka ovat osa luokkaa: menetelmiä.
JavaScript-luokat tukevat sekä instansseja että staattisia menetelmiä.
4.1 Instanssimenetelmät
Instanssimenetelmät voivat käyttää ja muokata instanssitietoja. Instanssimenetelmät voivat kutsua muita instanssimenetelmiä sekä mitä tahansa staattista menetelmää.,
esimerkiksi, katsotaanpa määritellä menetelmä getName()
, joka palauttaa nimen User
class:
luokan menetelmä, sekä rakentaja, this
arvo on yhtä suuri kuin luokan ilmentymän. Käyttää this
käyttää esimerkiksi tiedot: this.field
, tai jopa kutsua muita menetelmiä: this.method()
.,
Anna lisää uusi menetelmä nameContains(str)
, jolla on yksi parametri, ja kehottaa toinen tapa:
nameContains(str) { ... }
tapa User
luokka, joka hyväksyy yhden parametrin str
. Lisäksi se toteuttaa toisen menetelmän, jossa instanssi this.getName()
saa käyttäjän nimen.
menetelmä voi olla myös yksityinen. Jotta menetelmä olisi yksityinen etuliite, sen nimi on #
.
tehdään getName()
menetelmä yksityinen:
#getName()
on oma menetelmä., Metodin sisällä nameContains(str)
soita oma menetelmä tällainen tapa: this.#getName()
.
yksityiseksi, #getName()
ei voi olla kutsutaan ulkopuolella User
luokan elin.
4.2 Getter-ja setter –
getter ja setteri jäljitellä säännöllisesti kentällä, mutta enemmän valvontaa, miten kenttä on käytettävissä ja muuttunut.
getter suoritetaan yrityksenä saada kentän arvo, kun taas setter yrittää asettaa arvon.,
varmista, että name
omaisuutta User
ei voi olla tyhjä, lopetetaan yksityinen kenttä #nameValue
show getter ja setteri:
get name() {...}
getter suoritetaan, kun avaat arvo-kenttään: user.name
.
4.3 staattiset menetelmät
staattiset menetelmät ovat funktioita, jotka on liitetty suoraan luokkaan. Heillä on logiikkaa, joka liittyy luokkaan, eikä luokan tapaukseen.,
Voit luoda staattinen menetelmä käyttää erityistä avainsana static
seuraa säännöllisesti menetelmän syntaksi: static myStaticMethod() { ... }
.
Kun työskentelee staattisia menetelmiä, on 2 yksinkertaisia sääntöjä muistaa:
- staattinen menetelmä voi käyttää staattisia kenttiä
- staattinen menetelmä ei voi käyttää, esimerkiksi kentät.
esimerkiksi luodaan staattinen menetelmä, joka havaitsee, onko tietyllä nimellä varustettu käyttäjä jo otettu.,
isNameTaken()
on staattinen menetelmä, joka käyttää staattista yksityinen kenttä User.#takenNames
tarkistaa otettu nimiä.
5. Perintö: ulottuu
luokat JavaScript-tuki yhden perintö käyttäen extends
avainsana.
expression class Child extends Parent { }
Child
luokka perii Parent
konstruktori, kentät ja metodit.
esimerkiksi, katsotaanpa luoda uuden lapsen luokka ContentWriter
, joka ulottuu vanhemman luokan User
.,
ContentWriter
perii User
konstruktori, metodi getName()
ja name
. Myös ContentWriter
– Luokka julistaa uuden kentän posts
.
huomaa, että vanhempainluokan yksityiset jäsenet eivät ole lapsiluokan perimiä.
5.1 Vanhemman rakentaja: super() vuonna rakentaja()
Jos haluat soittaa vanhemman rakentaja lapsi luokan, sinun täytyy käyttää super()
special-toiminto on käytettävissä, kun lapsi rakentaja.,
esimerkiksi, katsotaanpa tehdä ContentWriter
rakentaja soittaa vanhemman rakentajan User
, sekä alustaa viestit-kenttään:
super(name)
sisällä lapsen luokka ContentWriter
suorittaa rakentajan vanhemman luokan User
.
Huomaa, että sisällä lapsen rakentaja, sinun täytyy suorittaa super()
ennen this
avainsana. Kutsuminen super()
pitää huolen siitä, että vanhempi konstruktori alustaa instanssin.,
class Child extends Parent { constructor(value1, value2) { // Does not work! this.prop2 = value2; super(value1); }}
5.2 Vanhempi esimerkiksi: super menetelmiä
Jos haluat käyttää vanhemman menetelmä sisällä lapsen menetelmää, voit käyttää erityisiä pikanäppäintä super
.
getName()
lapsen luokka ContentWriter
käyttää menetelmää super.getName()
suoraan vanhemman luokan User
.
tätä ominaisuutta kutsutaan menetelmän ohittamiseksi.
Huomaa, että voit käyttää super
staattinen menetelmät liian, käyttää vanhemman staattisia menetelmiä.
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
on monimuotoinen: operaattori havaitsee lapsen, kuten esimerkiksi vanhemman luokan.
writer
on esimerkiksi lapsen luokka ContentWriter
. Operaattori writer instanceof ContentWriter
arvioi true
.
samalla ContentWriter
onko lapsen luokka User
. Niin writer instanceof User
arvioi true
samoin.
Mitä jos haluaisit määrittää instanssin tarkan luokan?, Voit käyttää constructor
omaisuutta ja vertailla suoraan luokan kanssa:
writer.constructor === ContentWriter; // => truewriter.constructor === User; // => false
7. Sarjat ja prototyypit
– täytyy sanoa, että luokan syntaksi JavaScript tekee hienoa työtä abstrahoitua prototypal perintö. Kuvatakseni class
syntaksia en ole edes käyttänyt termiä prototyyppi.
mutta luokat on rakennettu prototyyppisen perinnön päälle. Jokainen luokka on funktio, ja luo instanssin, kun siihen vedotaan konstruktorina.
seuraavat kaksi koodinpätkää ovat ekvivalentteja.,
luokka-versio:
version käyttäen prototyyppi:
class syntaksi on tapa helpompi työskennellä, jos olet perehtynyt klassinen perintö mekanismi Java-tai Swift-kielellä.
joka tapauksessa, vaikka käytät class syntaksi JavaScript, suosittelen sinua on hyvä käsitys prototypal perintö.
8. Luokan ominaisuudet saatavuus
tässä viestissä esitetyt luokkaominaisuudet jakautuvat ES2015: een ja ehdotukset vaiheessa 3.,
vuoden 2019 loppuun mennessä, luokan ominaisuudet jaetaan:
- Julkisen ja yksityisen esimerkiksi kentät ovat osa Luokan kentät ehdotuksen
- Yksityisen esimerkiksi menetelmiä ja aksessoreita ovat osa Luokan yksityiset metodit ehdotuksen
- Julkisen ja yksityisen staattiset kentät ja yksityinen staattinen menetelmät ovat osa Luokan staattisia ominaisuuksia ehdotuksen
- loput on osa ES2015 standardi.
9. Johtopäätös
JavaScript-luokat alustavat instanssit konstruktoreilla, määrittelevät kentät ja menetelmät., Kenttiä ja menetelmiä voi liittää jopa itse luokkaan käyttäen static
avainsanaa.
perintö saavutetaanextends
avainsanalla: voit helposti luoda lapsiluokan vanhemmalta. super
avainsana on käytetty vanhemman luokan lapsi luokassa.
hyödyntääkseen kapselointia, tehdäkseen kentät ja menetelmät yksityisiksi piilottaakseen luokkien sisäiset yksityiskohdat. Yksityisten kenttien ja menetelmien nimet tulee aloittaa #
.,
JavaScriptin luokat muuttuvat yhä kätevämmiksi käyttää.
Mitä mieltä olet käyttäen #
etuliite yksityinen ominaisuuksia?