Getter y Setter de JavaScript (con ejemplos)

En este tutorial, aprenderá sobre los métodos getter y setter de JavaScript con la ayuda de ejemplos.

En JavaScript, hay dos tipos de propiedades de objeto:

  • Propiedades de datos
  • Propiedades de accesor

Propiedad de datos

A continuación, se muestra un ejemplo de propiedad de datos que hemos estado usando en los tutoriales anteriores.

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

Propiedad accesoria

En JavaScript, las propiedades de acceso son métodos que obtienen o establecen el valor de un objeto. Para eso, usamos estas dos palabras clave:

  • get - para definir un método getter para obtener el valor de la propiedad
  • set - para definir un método de establecimiento para establecer el valor de la propiedad

Getter de JavaScript

En JavaScript, los métodos getter se utilizan para acceder a las propiedades de un objeto. Por ejemplo,

 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

En el programa anterior, getName()se crea un método getter para acceder a la propiedad de un objeto.

 get getName() ( return this.firstName; )

Nota: Para crear un método getter, getse utiliza la palabra clave.

Y también al acceder al valor, accedemos al valor como propiedad.

 student.getName;

Cuando intenta acceder al valor como método, se produce un error.

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

Setter JavaScript

En JavaScript, los métodos de establecimiento se utilizan para cambiar los valores de un objeto. Por ejemplo,

 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

En el ejemplo anterior, el método setter se usa para cambiar el valor de un objeto.

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

Nota: Para crear un método de establecimiento, setse utiliza la palabra clave.

Como se muestra en el programa anterior, el valor de firstNamees Monica.

Luego, el valor se cambia a Sarah.

 student.chageName = 'Sarah';

Nota : Setter debe tener exactamente un parámetro formal.

JavaScript Object.defineProperty ()

En JavaScript, también puede usar el Object.defineProperty()método para agregar captadores y definidores. Por ejemplo,

 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

En el ejemplo anterior, Object.defineProperty()se usa para acceder y cambiar la propiedad de un objeto.

La sintaxis para usar Object.defineProperty()es:

 Object.defineProperty(obj, prop, descriptor)

El Object.defineProperty()método toma tres argumentos.

  • El primer argumento es objectName.
  • El segundo argumento es el nombre de la propiedad.
  • El tercer argumento es un objeto que describe la propiedad.

Articulos interesantes...