javascript property change event

Question

Necesito disparar un evento cada vez que se actualiza/cambia una propiedad para mantener los elementos dom sincronizados con los valores de propiedad en el modelo (estoy usando la herencia simple de john resig http://ejohn.org/blog/simple-javascript-inheritance/). ¿Es posible hacerlo de una manera cruzada? Me parece que si pudiera ajustar cualquier función que use js para establecer propiedades y hacer que desencadene un evento, que podría funcionar, no estoy seguro de cómo hacerlo.

Answer 1

JavaScript no usa una función para establecer propiedades. Son solo variables, y su configuración no requiere envoltorios elaborados.

Usted puede utilizar una función para establecer la propiedad, sin embargo - el mismo tipo de un acuerdo de captador/definidor puede utilizar en un idioma que admiten los datos privados en las clases. De esa forma, su función podría ejecutar fácilmente otras funciones que se hayan registrado como devoluciones de llamada. Usando jQuery, incluso puedes manejarlos como eventos.

$(yourObject).bind('some-event-you-made-up', function() { 
    // This code will run whenever some-event-you-made-up is triggered on yourObject 
}); 

// ... 

$(yourObject).trigger('some-event-you-made-up'); 

Answer 2

Tal vez ya resuelto su problema con jQuery bind/gatillo, pero quería decir que estoy construyendo un seguimiento de cambios y (en la parte superior de eso) Entidad que modela el marco Javascript, llamado "tienda" que resuelve el problema que expone, sin requerir ninguna sintaxis especial en la manipulación de objetos, su código abierto y alojado en:

https://github.com/benjamine/tent

está documentado con jsdoc y la unidad probada con js-piloto de pruebas.

puede utilizar el módulo de seguimiento de cambios de esta manera:

var myobject = { name: 'john', age: 34 }; 

    // add a change handler that shows changes on alert dialogs 
    tent.changes.bind(myobject, function(change) { 
     alert('myobject property '+change.data.propertyName+' changed!'); 
    }); 

    myobject.name = 'charly'; // gets notified on an alert dialog 

funciona con matriz cambia también (añade, elimina). Además, puede usar Contextos de "Entidad" para mantener un conjunto de cambios de todos los cambios detectados (elementos AGREGADOS, SUPRIMIDOS o MODIFICADOS) agrupados en colecciones, agregar y eliminar cascadas, mantener sincronizadas las propiedades inversas, rastrear 1 a 1, 1 a N y relaciones-N-to-M, etc.

Answer 3

usted podría intentar Javascript Property Events (jpe.js)

me encontré con un problema similar, y terminó escribiendo una función de sobrecarga para Object.defineProperty que agrega controladores de eventos a las propiedades. También proporciona verificación de tipos (js-base-types) y almacena su valor internamente, evitando cambios no deseados.

Muestra de defineProperty normales:

Object.defineProperty(document, "property", { 
    get:function(){return myProperty}, 
    set:function(value){myProperty = value}, 
}) 
var myProperty = false; 

Muestra de propiedad con onchange evento:

Object.defineProperty(document, "property", { 
    default:false, 
    get:function(){}, 
    set:function(value){}, 
    onchange:function(event){console.info(event)} 
}) 

Answer 4

defineProperty Objeto/defineProperties hace el truco. Aquí va un código simple. He construido algunos marcos de unión basados ​​en esos datos, y se puede volver muy compleja, pero para el ejercicio de su siguiente manera:

var oScope = { 
    $privateScope:{}, 
    notify:function(sPropertyPath){ 
     console.log(sPropertyPath,"changed"); 
    } 
}; 
Object.defineProperties(oScope,{ 
    myPropertyA:{ 
     get:function(){ 
      return oScope.$privateScope.myPropertyA 
     }, 
     set:function(oValue){ 
      oScope.$privateScope.myPropertyA = oValue; 
      oScope.notify("myPropertyA"); 
     } 
    } 
}); 

oScope.myPropertyA = "Some Value"; 
//console will log: myPropertyA changed