JavaScript Getter és Setter (példákkal)

Ebben az oktatóanyagban példák segítségével megismerheti a JavaScript getter és setter módszereket.

A JavaScript-ben kétféle objektumtulajdonság létezik:

  • Adatok tulajdonságai
  • Hozzáférő tulajdonságok

Adattulajdonság

Íme egy példa az előző oktatóanyagokban használt adat tulajdonságokra.

 const student = ( // data property firstName: 'Monica'; );

Hozzáférő tulajdonság

A JavaScriptben az accessor tulajdonságok olyan módszerek, amelyek lekérik vagy beállítják az objektum értékét. Ehhez a következő két kulcsszót használjuk:

  • get - egy getter metódus meghatározása a tulajdonságérték megszerzéséhez
  • set - egy szetter módszer meghatározása a tulajdonság értékének beállításához

JavaScript Getter

A JavaScript-ben getter metódusokat használnak az objektum tulajdonságainak eléréséhez. Például,

 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

A fenti programban egy getter metódus getName()jön létre az objektum tulajdonságainak elérésére.

 get getName() ( return this.firstName; )

Megjegyzés: A getter módszer létrehozásához a getkulcsszót kell használni.

És az érték elérésekor az értéket tulajdonként is elérjük.

 student.getName;

Amikor megpróbálja az értéket metódusként elérni, hiba lép fel.

 console.log(student.getName()); // error

JavaScript szetter

A JavaScript-ben szetter módszereket használnak az objektum értékeinek megváltoztatására. Például,

 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

A fenti példában a setter metódust használják az objektum értékének megváltoztatására.

 set changeName(newName) ( this.firstName = newName; )

Megjegyzés: Szetter módszer létrehozásához a setkulcsszót kell használni.

Amint az a fenti program, az értéke firstNamevan Monica.

Ezután az érték megváltozik Sarah.

 student.chageName = 'Sarah';

Megjegyzés : A szetternek pontosan egy formális paraméterrel kell rendelkeznie.

JavaScript Object.defineProperty ()

A JavaScript-ben Object.defineProperty()metódust is használhat getterek és beállítók hozzáadásához. Például,

 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

A fenti példában Object.defineProperty()egy objektum tulajdonságainak elérésére és megváltoztatására használják.

A használat szintaxisa Object.defineProperty():

 Object.defineProperty(obj, prop, descriptor)

A Object.defineProperty()módszer három érvet tartalmaz.

  • Az első argumentum az objectName.
  • A második érv az ingatlan neve.
  • A harmadik argumentum a tulajdonságot leíró objektum.

érdekes cikkek...