2009-06-30 14 views
19

El paso por el javascript documentación, que encontraron los siguientes dos funciones en un objeto JavaScript parece interesante:Oyente de la propiedad valor cambia en un objeto JavaScript

.watch - Relojes para una propiedad que se debe asignar un valor y se ejecuta una función cuando que ocurre.
.unwatch - Elimina un conjunto de puntos de observación con el método de observación.

Ejemplo de uso:

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

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

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

estoy trabajando en javascript para las rápidas pocos años y nunca utiliza estas funciones.
¿Puede alguien arrojar algunos buenos casos de uso donde estas funciones serán útiles?

+2

Estos están disponibles sólo para los navegadores basados ​​en Gecko, como Mozilla Firefox. Internet Explorer expone a través de un método similar en objetos, llamado onpropertychange. –

Respuesta

8

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

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

Puedes usarla para validar longitud de la cadena:

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

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

+1

Heads up, ahora disponible en todos los navegadores modernos. Sugerencia: utilice getter y setter en su lugar. –

1

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

Tomando el código que daría lugar a 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); 
    } 
}) 
Cuestiones relacionadas