Tässä opetusohjelmassa opit JavaScriptin getter- ja setterimenetelmistä esimerkkien avulla.
JavaScriptissä on kahdenlaisia objektiominaisuuksia:
- Tietojen ominaisuudet
- Lisälaitteen ominaisuudet
Data-ominaisuus
Tässä on esimerkki dataomaisuudesta, jota olemme käyttäneet edellisissä opetusohjelmissa.
const student = ( // data property firstName: 'Monica'; );
Accessor-ominaisuus
JavaScriptissä Accessor-ominaisuudet ovat menetelmiä, joilla saadaan tai asetetaan objektin arvo. Tätä varten käytämme näitä kahta avainsanaa:
get
- määritellä getter-menetelmä ominaisuusarvon saamiseksiset
- määrittää setterimenetelmän ominaisuuden arvon asettamiseksi
JavaScript Getter
JavaScriptissä getter-menetelmiä käytetään objektin ominaisuuksien käyttämiseen. Esimerkiksi,
const student = ( // data property firstName: 'Monica', // accessor property(getter) get getName() ( return this.firstName; ) ); // accessing data property console.log(student.firstName); // Monica // accessing getter methods console.log(student.getName); // Monica // trying to access as a method console.log(student.getName()); // error
Edellä olevassa ohjelmassa luodaan getter-menetelmä getName()
objektin ominaisuuden käyttämiseksi.
get getName() ( return this.firstName; )
Huomaa: Getter-menetelmän luomiseen käytetään get
avainsanaa.
Ja myös arvoa käytettäessä käytämme arvoa ominaisuutena.
student.getName;
Kun yrität käyttää arvoa menetelmänä, tapahtuu virhe.
console.log(student.getName()); // error
JavaScript-asetin
JavaScriptissä setter-menetelmiä käytetään objektin arvojen muuttamiseen. Esimerkiksi,
const student = ( firstName: 'Monica', //accessor property(setter) set changeName(newName) ( this.firstName = newName; ) ); console.log(student.firstName); // Monica // change(set) object property using a setter student.changeName = 'Sarah'; console.log(student.firstName); // Sarah
Edellä olevassa esimerkissä setter-menetelmää käytetään objektin arvon muuttamiseen.
set changeName(newName) ( this.firstName = newName; )
Huomaa: Setterimenetelmän luomiseen käytetään set
avainsanaa.
Kuten yllä olevassa ohjelmassa on esitetty, arvo firstName
on Monica
.
Sitten arvo muutetaan arvoksi Sarah
.
student.chageName = 'Sarah';
Huomaa : Setterillä on oltava täsmälleen yksi virallinen parametri.
JavaScript Object.defineProperty ()
JavaScriptissä voit myös käyttää Object.defineProperty()
menetelmää lisätäksesi ketjut ja asettimet. Esimerkiksi,
const student = ( firstName: 'Monica' ) // getting property Object.defineProperty(student, "getName", ( get : function () ( return this.firstName; ) )); // setting property Object.defineProperty(student, "changeName", ( set : function (value) ( this.firstName = value; ) )); console.log(student.firstName); // Monica // changing the property value student.changeName = 'Sarah'; console.log(student.firstName); // Sarah
Yllä olevassa esimerkissä Object.defineProperty()
käytetään objektin ominaisuuksien käyttämiseen ja muuttamiseen.
Syntaksi käytölle Object.defineProperty()
on:
Object.defineProperty(obj, prop, descriptor)
Object.defineProperty()
Menetelmä kestää kolme argumenttia.
- Ensimmäinen argumentti on objectName.
- Toinen argumentti on kiinteistön nimi.
- Kolmas argumentti on objekti, joka kuvaa ominaisuutta.