Question about get method in javascript

Question:

One question, what is the use of externalizing a property, I have created a total property with the get method, but why is it necessary? Since doing a method I can call it the same with () and it will return what I want, instead of get total () I make total () and now, I don't see much newness of the get method

 class Factura { constructor(divisa, nombre, importe, IVA = importe * .1) { this._divisa = divisa; this._nombre = nombre; this._importe = importe; this._IVA = IVA; } presentacion (){ return ' La factura ' + this._nombre + ' tiene un importe de ' + this._importe + ' ' + this._divisa + ' y con el IVA, se queda en ' } get total(){ return this._importe + this._IVA; } // totalDescuento(){ // return this._importe + this._IVA - // } } let factura1 = new Factura('eur', 'Transportes Chemita', 300); let factura2 = new Factura('eur', 'Transportes Fran', 600); let factura3 = new Factura('eur', 'Transportes Ailyn', 900); let factura4 = new Factura('eur', 'Transportes alvaro', 9000); let factura5 = new Factura('eur', 'Transportes carlos', 9200); let factura6 = new Factura('eur', 'Transportes pepito', 9100); document.write(factura1.presentacion() + factura1.total + ' eur' + '<br>'); document.write(factura2.presentacion() + factura2.total + ' eur' + '<br>'); document.write(factura3.presentacion() + factura3.total + ' eur' + '<br>'); document.write(factura4.presentacion() + factura4.total + ' eur' + '<br>'); document.write(factura5.presentacion() + factura5.total + ' eur' + '<br>'); document.write(factura6.presentacion() + factura6.total + ' eur' + '<br>');

Answer:

Basically what the get and set methods give you is to be able to establish logic when setting and retrieving property values ​​while maintaining the object's property syntax:

// Para recuperar valor
var valor = instancia.nombrePropiedad;
// Para establecer valor
instancia.nombrePropiedad = valor;

Imagine that you have a Persona type with a nombreCompleto property that returns the person's full name (name + surname) and also allows you to set this value:

 class Persona { constructor(nombre, apellidos) { this.nombre = nombre; this.apellidos = apellidos; } get nombreCompleto(){ return (this.nombre ? this.nombre + ' ' : '') + (this.apellidos ? this.apellidos : ''); } set nombreCompleto(value){ if (typeof value === 'string'){ var parts = value.split(' '); this.nombre = parts[0]; this.apellidos = parts.slice(1).join(' '); } } } var foo = new Persona('Asier', 'Villanueva Rodilla'); console.log(foo, foo.nombreCompleto); foo.nombreCompleto='Pedro Picapiedra'; console.log(foo, foo.nombreCompleto);

As you can see, both to retrieve and to set the value, the syntax foo.nombreCompleto is used.

Until ECMAScript 5 you would have to create two methods to do this: one to retrieve the value and one to set it.

 function Persona(nombre, apellidos) { this.nombre = nombre; this.apellidos = apellidos; this.getNombreCompleto = function(){ return (this.nombre ? this.nombre + ' ' : '') + (this.apellidos ? this.apellidos : ''); } this.setNombreCompleto = function(value){ if (typeof value === 'string'){ var parts = value.split(' '); this.nombre = parts[0]; this.apellidos = parts.slice(1).join(' '); } } } var foo = new Persona('Asier', 'Villanueva Rodilla'); console.log({nombre: foo.nombre, apellidos: foo.apellidos}, foo.getNombreCompleto()); foo.setNombreCompleto('Pedro Picapiedra'); console.log({nombre: foo.nombre, apellidos: foo.apellidos}, foo.getNombreCompleto());

Here you would use the getNombreCompleto method to retrieve the value and the setNombreCompleto method to set it.

In this way you abstract the internal implementation details of the developer that makes use of the external api of the object.

Perhaps the most practical case is when you want to add a validation to an existing property. With the previous method you would have to leave the variable that stores the value as private and create a method to set the value that performs the validation (such as the setNombreCompleto ). This would force all lines of code that set the value of this property to be modified. Using a set method you could add that internal validation without having to change all the code that uses the external api.

Scroll to Top