JavaScript Getter e Setter (con esempi)

In questo tutorial imparerai a conoscere i metodi getter e setter di JavaScript con l'aiuto di esempi.

In JavaScript, esistono due tipi di proprietà degli oggetti:

  • Proprietà dei dati
  • Proprietà degli accessori

Proprietà dei dati

Ecco un esempio di proprietà dei dati che abbiamo utilizzato nei tutorial precedenti.

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

Proprietà Accessor

In JavaScript, le proprietà della funzione di accesso sono metodi che ottengono o impostano il valore di un oggetto. Per questo, utilizziamo queste due parole chiave:

  • get - per definire un metodo getter per ottenere il valore della proprietà
  • set - per definire un metodo setter per impostare il valore della proprietà

JavaScript Getter

In JavaScript, i metodi getter vengono utilizzati per accedere alle proprietà di un oggetto. Per esempio,

 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

Nel programma precedente, getName()viene creato un metodo getter per accedere alla proprietà di un oggetto.

 get getName() ( return this.firstName; )

Nota: per creare un metodo getter, getviene utilizzata la parola chiave.

E anche quando si accede al valore, accediamo al valore come proprietà.

 student.getName;

Quando si tenta di accedere al valore come metodo, si verifica un errore.

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

Setter JavaScript

In JavaScript, i metodi setter vengono utilizzati per modificare i valori di un oggetto. Per esempio,

 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

Nell'esempio precedente, il metodo setter viene utilizzato per modificare il valore di un oggetto.

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

Nota: per creare un metodo setter, setviene utilizzata la parola chiave.

Come mostrato nel programma precedente, il valore di firstNameè Monica.

Quindi il valore viene modificato in Sarah.

 student.chageName = 'Sarah';

Nota : il setter deve avere esattamente un parametro formale.

JavaScript Object.defineProperty ()

In JavaScript, puoi anche utilizzare il Object.defineProperty()metodo per aggiungere getter e setter. Per esempio,

 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

Nell'esempio precedente, Object.defineProperty()viene utilizzato per accedere e modificare la proprietà di un oggetto.

La sintassi per l'utilizzo Object.defineProperty()è:

 Object.defineProperty(obj, prop, descriptor)

Il Object.defineProperty()metodo accetta tre argomenti.

  • Il primo argomento è objectName.
  • Il secondo argomento è il nome della proprietà.
  • Il terzo argomento è un oggetto che descrive la proprietà.

Articoli interessanti...