In deze tutorial leer je met behulp van voorbeelden over JavaScript-getter- en setter-methoden.
In JavaScript zijn er twee soorten objecteigenschappen:
- Gegevenseigenschappen
- Accessor-eigenschappen
Data-eigenschap
Hier is een voorbeeld van een gegevenseigenschap die we in de vorige tutorials hebben gebruikt.
const student = ( // data property firstName: 'Monica'; );
Accessor-eigendom
In JavaScript zijn accessor-eigenschappen methoden die de waarde van een object ophalen of instellen. Daarvoor gebruiken we deze twee sleutelwoorden:
get
- om een getter-methode te definiëren om de eigenschapswaarde te krijgenset
- om een setter-methode te definiëren om de eigenschapswaarde in te stellen
JavaScript Getter
In JavaScript worden getter-methoden gebruikt om toegang te krijgen tot de eigenschappen van een object. Bijvoorbeeld,
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
In het bovenstaande programma wordt een getter-methode getName()
gemaakt om toegang te krijgen tot de eigenschap van een object.
get getName() ( return this.firstName; )
Opmerking: om een getter-methode te maken, wordt het get
trefwoord gebruikt.
En ook bij het opvragen van de waarde, hebben we toegang tot de waarde als eigenschap.
student.getName;
Wanneer u probeert toegang te krijgen tot de waarde als een methode, treedt er een fout op.
console.log(student.getName()); // error
JavaScript-setter
In JavaScript worden setter-methoden gebruikt om de waarden van een object te wijzigen. Bijvoorbeeld,
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
In het bovenstaande voorbeeld wordt de setter-methode gebruikt om de waarde van een object te wijzigen.
set changeName(newName) ( this.firstName = newName; )
Opmerking: om een setter-methode te maken, wordt het set
trefwoord gebruikt.
Zoals getoond in het programma, de waarde firstName
is Monica
.
Vervolgens wordt de waarde gewijzigd in Sarah
.
student.chageName = 'Sarah';
Opmerking : Setter moet precies één formele parameter hebben.
JavaScript Object.defineProperty ()
In JavaScript kunt u ook de Object.defineProperty()
methode gebruiken om getters en setters toe te voegen. Bijvoorbeeld,
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
In het bovenstaande voorbeeld Object.defineProperty()
wordt gebruikt om toegang te krijgen tot en de eigenschap van een object te wijzigen.
De syntaxis voor gebruik Object.defineProperty()
is:
Object.defineProperty(obj, prop, descriptor)
De Object.defineProperty()
methode heeft drie argumenten.
- Het eerste argument is de objectnaam.
- Het tweede argument is de naam van de eigenschap.
- Het derde argument is een object dat de eigenschap beschrijft.