Perintö on keskeinen käsite olio-ohjelmoinnissa, joka mahdollistaa olemassa olevien luokkien laajentamisen sekä niiden ominaisuuksien ja metodien hyödyntämisen. JavaScript on tuonut ES6:n myötä uudempia ja vankempia perintösynteesejä, jotka ovat huomattavasti helpompia käsitellä kuin alkuperäiset prototyyppimenetelmät. Tässä oppaassa näytän sinulle, kuinka voit soveltaa perintöä JavaScriptissä extends-avainsanan avulla, ja selitän vaihe vaiheelta, kuinka kutsut perusluokan konstruktorin oikein super-käskyllä.
Tärkeimmät havainnot
- Perintö JavaScriptissä tapahtuu extends-avainsanan kautta.
- Perusluokan konstruktori on kutsuttava superilla.
- Instanssimuuttujia voidaan viitata derived-luokassa this-avainsanalla.
Vaiheittain opas
Perusluokan luominen
Aloittaaksemme perinnön, luomme ensin perusluokan nimeltä Shape. Tässä luokassa määrittelemme konstruktorin sekä muutamia metodeja.
Tässä määrittelet luokan Shape, jolla on konstruktori. Tässä konstruktorissa voit määritellä muuttujia ja funktioita, joihin muut luokat voivat päästä käsiksi.

Alaluokan tutkiminen
Perusluokan luomisen jälkeen voit nyt luoda alaluokan, joka perii Shape-luokasta. Tässä esimerkissä kutsumme uutta luokkaa ConcreteShape.
Tässä alaluokassa käytämme extends-avainsanaa osoittaaksemme, että ConcreteShape perii Shape-luokasta. Alaluokan konstruktori kutsuu perusluokan Shape-konstruktorin super()-käskyllä, mikä on välttämätöntä perinnön oikean toteuttamisen kannalta.
Alaluokan instansiointi
Nyt kun olemme luoneet alaluokan, on aika luoda instanssi tästä luokasta.
Tässä luot uuden myShape-olion ConcreteShape-luokasta ja annat kuvauksen konstruktorille. Sen jälkeen kutsut print-metodia, joka tulostaa kuvauksen.
Lisäominaisuuksien lisääminen
Voit lisätä alaluokallesi lisää ominaisuuksia tai jopa metodeja, jotka ovat erityisiä tälle alaluokalle.
Tässä olet laajentanut ConcreteShape-luokkaa lisäämällä lisäparametreja konstruktorille.
Perinnön hyödyntäminen
super-avainsanalla voit kutsua perusluokan describe-metodia, jotta voit yhdistää perusluokan ja alaluokan ominaisuuksia.
Yhteenveto – Perintö JavaScriptissä: ES6:sta ES13:een
Tässä oppaassa olet oppinut, kuinka perintö toimii JavaScriptissä, erityisesti uuden class-syntaksin avulla. Olet nähnyt, kuinka määritetään luokkia, kuinka perit perusluokasta ja kuinka kutsut konstruktorin oikein. Nämä mekanismit helpottavat koodisi perusteiden pitämistä puhtaana ja ylläpidettävänä, sillä voit hyödyntää ominaisuuksia tehokkaasti.
Usein kysytyt kysymykset
Mikä on ero super() ja this:n välillä?super() käytetään kutsumaan perusluokan konstruktoria, kun taas this viittaa nykyisen luokan instanssiin.
Miksi ES6-luokkien käyttö on parempaa kuin prototyypit?ES6-luokat tarjoavat selkeämmän ja intuitiivisemman syntaksin, mikä helpottaa koodin lukemista ja ymmärtämistä.
Voinko saada useita perusluokkia?Ei, JavaScript ei tue moniperintöä. Luokka voi periä vain yhdestä toisesta luokasta.
Mitä tapahtuu, jos en kutsu super():a?Jos et kutsu super():a, saat virheen, koska perusluokan konstruktoria, joka alustaa luokalle tarvittavat asiat, ei suoriteta.