JavaScript Hechiceros y Setters


Ejemplo

Getters y setters le permiten definir un comportamiento personalizado para leer y escribir una propiedad determinada en su clase. Para el usuario, parecen lo mismo que cualquier propiedad típica. Sin embargo, internamente una función personalizada que usted proporciona se usa para determinar el valor cuando se accede a la propiedad (el captador), y para realizar cualquier cambio necesario cuando se asigna la propiedad (el establecedor).

En una definición de class , un captador se escribe como un método sin argumentos prefijado por la palabra clave get . Un definidor es similar, excepto que acepta un argumento (se asigna el nuevo valor) y en su lugar se usa la palabra clave set .

Aquí hay una clase de ejemplo que proporciona un getter y setter para su propiedad .name . Cada vez que se asigna, registraremos el nuevo nombre en una matriz interna .names_ . Cada vez que se accede, devolveremos el último nombre.

class MyClass {
    constructor() {
        this.names_ = [];
    }

    set name(value) {
        this.names_.push(value);
    }

    get name() {
        return this.names_[this.names_.length - 1];
    }
}

const myClassInstance = new MyClass();
myClassInstance.name = 'Joe';
myClassInstance.name = 'Bob';

console.log(myClassInstance.name); // logs: "Bob"
console.log(myClassInstance.names_); // logs: ["Joe", "Bob"]

Si solo define un definidor, intentar acceder a la propiedad siempre se devolverá undefined .

const classInstance = new class {
    set prop(value) {
        console.log('setting', value);
    }
};

classInstance.prop = 10; // logs: "setting", 10

console.log(classInstance.prop); // logs: undefined

Si solo define un captador, intentar asignar la propiedad no tendrá ningún efecto.

const classInstance = new class {
    get prop() {
        return 5;
    }
};

classInstance.prop = 10;

console.log(classInstance.prop); // logs: 5