Getter e Setter de JavaScript (com exemplos)

Neste tutorial, você aprenderá sobre os métodos getter e setter de JavaScript com a ajuda de exemplos.

Em JavaScript, existem dois tipos de propriedades de objeto:

  • Propriedades de dados
  • Propriedades do acessador

Propriedade de Dados

Aqui está um exemplo de propriedade de dados que usamos nos tutoriais anteriores.

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

Propriedade acessora

Em JavaScript, as propriedades do acessador são métodos que obtêm ou definem o valor de um objeto. Para isso, usamos estas duas palavras-chave:

  • get - definir um método getter para obter o valor da propriedade
  • set - para definir um método setter para definir o valor da propriedade

JavaScript Getter

Em JavaScript, os métodos getter são usados ​​para acessar as propriedades de um objeto. Por exemplo,

 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

No programa acima, um método getter getName()é criado para acessar a propriedade de um objeto.

 get getName() ( return this.firstName; )

Nota: Para criar um método getter, a getpalavra-chave é usada.

E também ao acessar o valor, acessamos o valor como uma propriedade.

 student.getName;

Ao tentar acessar o valor como um método, ocorre um erro.

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

Setter JavaScript

Em JavaScript, os métodos setter são usados ​​para alterar os valores de um objeto. Por exemplo,

 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

No exemplo acima, o método setter é usado para alterar o valor de um objeto.

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

Nota: Para criar um método setter, a setpalavra-chave é usada.

Conforme mostrado no programa acima, o valor de firstNameé Monica.

Em seguida, o valor é alterado para Sarah.

 student.chageName = 'Sarah';

Nota : Setter deve ter exatamente um parâmetro formal.

JavaScript Object.defineProperty ()

Em JavaScript, você também pode usar o Object.defineProperty()método para adicionar getters e setters. Por exemplo,

 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

No exemplo acima, Object.defineProperty()é usado para acessar e alterar a propriedade de um objeto.

A sintaxe de uso Object.defineProperty()é:

 Object.defineProperty(obj, prop, descriptor)

O Object.defineProperty()método leva três argumentos.

  • O primeiro argumento é o objectName.
  • O segundo argumento é o nome da propriedade.
  • O terceiro argumento é um objeto que descreve a propriedade.

Artigos interessantes...