Javascript : setter & getter

Hola a todos!!...

Os regereseis -nose porque me hago el español :)- después de mucho tiempo de inactividad en mi blog, pero no asi en el mundo Internet/IT, con un nuevo tema y muy interesante para los desarrolladores, ...mayormente para aquellos que están del lado front-end.

Me refiero a Javascript y los famosos GET & SET

Manos a la obra!!

Si bien, en js podemos crear propiedades para un objeto de varias formas, siendo la más común añadiéndola con un punto o de forma literal, hay veces que es necesario hacer ciertas "modificaciones" o transformación al valor a setear o sino, obtener de una forma "distinta" o diferente el valor de cierto campo o propiedad.

Veamos un ejemplo simple:

// Creo una "clase" Persona
function Personas(nombre, apellido) {
    this.firstname = nombre; // Seteo nombre que se envía por parámetro
    this.surname = apellido; // Seteo apellido que se envía por parámetro
}
// Hasta aquí todo normal...
 
// La magia!! :)
Personas.prototype = {
    /* Creo una propiedad GET en el cual, al momento de llamarla, me mostrara el apellido y 
       nombre en el formato que se visualiza */
    get FullName() { return this.surname + ', ' + this.firstname; },
    /* En éste caso, lo que hacemos es que, al momento de setear un dato, éste se guardara 
       en mayúsculas */
    set SetSurnameToUpperCase(name) {
        var upperName = name || this.surname;
        this.surname = upperName.toUpperCase();
    }
};
 
 
// Lo probamos..
var p = new Personas("Agustin", "Flador");
p.FullName; // Nos mostrara "Flador, Agustin"
p.SetSurnameToUpperCase = "Jose" // seteamos nuevo nombre
p.FullName; // Nos mostrara "JOSE, Agustin"

Otro ejemplo simple podria ser:

var lost = {
    loc: "Island",
    get location() {
        return this.loc;
    },
    set location(val) {
        this.loc = val;
    }
};
console.log(lost.location); // out "Island"
lost.location = "Another island";
console.log(lost.location);; // out "Another island"

Espero que les haya sido de utilidad.

Saludos... 

          ...y nos vemos en la proxima!!