Object.watch() per tutti i browser?

Question

Stavo cercando un modo semplice per monitorare un oggetto o una variabile per le modifiche, e ho trovato Object.watch(), che è supportato nei browser Mozilla, ma non in IE. Così ho iniziato a cercare in giro per vedere se qualcuno avesse scritto una sorta di equivalente.

Circa l'unica cosa che ho trovato è stato a jQuery plugin, ma non sono sicuro se questo è il modo migliore per andare. Certamente uso jQuery nella maggior parte dei miei progetti, quindi non sono preoccupato per l'aspetto jQuery ...

In ogni caso, la domanda: Qualcuno può mostrarmi un esempio funzionante di quel plugin jQuery? Ho problemi a farlo funzionare ...

O qualcuno sa di alternative migliori che funzionerebbero su browser incrociato?

Aggiornamento dopo risposte:

Grazie a tutti per le risposte! Ho provato il codice postato qui: http://webreflection.blogspot.com/2009/01/internet-explorer-object-watch.html

Ma non riuscivo a farlo funzionare con IE. Il codice qui sotto funziona bene in Firefox, ma non fa nulla in IE. In Firefox, ogni volta che viene modificato watcher.status, viene chiamato il numero document.write() in watcher.watch() ed è possibile visualizzare l'output sulla pagina. In IE, ciò non accade, ma posso vedere che watcher.status sta aggiornando il valore, perché l'ultima chiamata document.write() mostra il valore corretto (sia in IE che in FF). Ma, se la funzione di callback non viene chiamata, allora è un po 'inutile ... :)

Mi manca qualcosa?

var options = {'status': 'no status'}, 
watcher = createWatcher(options); 

watcher.watch("status", function(prop, oldValue, newValue) { 
    document.write("old: " + oldValue + ", new: " + newValue + "<br>"); 
    return newValue; 
}); 

watcher.status = 'asdf'; 
watcher.status = '1234'; 

document.write(watcher.status + "<br>"); 

Answer 1

(Ci scusiamo per il cross-posting, ma questa risposta che ho dato a una domanda simile funziona bene qui)

Ho creato un piccolo object.watch shim per questo qualche tempo fa. Funziona in IE8, Safari, Chrome, Firefox, Opera, ecc.

Answer 2

ho trovato due persone che affermano di aver risolto questo problema:

Crossbrowser Object watch (richieste di supporto per IE, Opera, Safari)

watch() Missing JS Function in IE con l'uso di prototype.js per IE (Opera? , Safari?)

Answer 3

Questo plug-in utilizza semplicemente un timer/intervallo per controllare ripetutamente le modifiche su un oggetto. Forse abbastanza buono ma personalmente vorrei più immediatezza come osservatore.

Ecco un tentativo di portare watch/unwatch in IE: http://webreflection.blogspot.com/2009/01/internet-explorer-object-watch.html.

Cambia la sintassi dal modo in Firefox di aggiungere osservatori. Invece di:

var obj = {foo:'bar'}; 
obj.watch('foo', fooChanged); 

Fate:

var obj = {foo:'bar'}; 
var watcher = createWatcher(obj); 
watcher.watch('foo', fooChanged); 

Non come dolce, ma come osservatore viene notificato immediatamente.

Answer 4

aggiornamento per la fine del 2015

Object.observe() è ora annullata. Scusa gente!

Aggiornamento per 2015

Usa Object.observe() from ES7.

Here's a polyfill.

Answer 5

penso anche che in questo momento la soluzione migliore è quella di utilizzare Watch.JS, trovare un bel tutorial qui: Listen/Watch for object or array changes in Javascript (Property changed event on Javascript objects)

Answer 6

Si noti che in Chrome 36 e versioni successive è possibile utilizzare Object.observe pure. Questo è in realtà una parte di un futuro standard ECMAScript e non una funzionalità specifica del browser come Mozilla Object.watch.

Object.observe funziona solo sulle proprietà dell'oggetto, ma è molto più performante di Object.watch (che è pensato per scopi di debug, non di produzione).

var options = {}; 

Object.observe(options, function(changes) { 
    console.log(changes); 
}); 

options.foo = 'bar'; 

Answer 7

è possibile utilizzare Object.defineProperty.

guardare la proprietà bar in foo

Object.defineProperty(foo, "bar", { 
    get: function (val){ 
     //some code to watch the getter function 
    }, 

    set: function (val) { 
     //some code to watch the setter function 
    } 
})