objetos - Escucha de cambios de valores de propiedad en un objeto javascript

new object javascript

Question

Al revisar la documentación de javascript, encontré que las siguientes dos funciones en un objeto JavaScript parecen interesantes:

.watch - .watch una propiedad a la que se le asignará un valor y ejecutará una función cuando eso ocurra.
.unwatch - Elimina un conjunto de puntos de observación con el método de observación.

Uso de muestra:

o = { p: 1 };
o.watch("p", function (id,oldval,newval) {
    console.log("o." + id + " changed from " + oldval + " to " + newval)
    return newval;
});

Cada vez que cambiamos el valor de propiedad de "p", esta función se activa.

o.p = 2;   //logs: "o.p changed from 1 to 2"

Estoy trabajando en javascript durante los últimos años y nunca he usado estas funciones.
¿Puede alguien arrojar algunos buenos casos de uso donde estas funciones serán útiles?

Answer 1

Para qué reloj realmente está diseñado es la validación de los valores de las propiedades. Por ejemplo, puede validar que algo es un número entero:

obj.watch(''count'', function(id, oldval, newval) {
    var val = parseInt(newval, 10);
    if(isNaN(val)) return oldval;
    return val;
});

Puede usarlo para validar la longitud de la cadena:

obj.watch(''name'', function(id, oldval, newval) {
    return newval.substr(0, 20);
});

Sin embargo, estos solo están disponibles en las últimas versiones del motor de JavaScript SpiderMonkey. Excelente si está usando Jaxer o integrando el motor de SpiderMonkey, pero aún no está realmente disponible en su navegador (a menos que esté usando FF3).

Answer 2

Eche un vistazo a Object.defineProperty y Object.prototype./__defineGetter__ () para ver hacia dónde se dirige esta funcionalidad.

Object.defineProperty debería estar disponible en todos los navegadores contemporáneos muy pronto.

Answer 3

Puede echar un vistazo a la biblioteca de Javascript Propery Events . Es una pequeña biblioteca que amplía Object.defineProperty con algunas personas que llamaron a eventos, que hice recientemente. Agrega algunas propiedades de on[event] que se pueden usar como las propiedades de on[event] de HTML-Objects. También tiene una verificación de tipo simple, que llama al evento onerror si falla.

Tomando su código resultaría en algo como esto:

var o = {}
Object.defineProperty(o, "p", {
    value:1,
    writable:true,
    onchange:function(e){
        console.log("o." + e.target + " changed from " + e.previousValue + " to " + e.returnValue);
    }
})