Object.watch() pour tous les navigateurs?

Question

Je cherchais un moyen facile de surveiller un objet ou une variable pour les changements, et j'ai trouvé Object.watch(), qui est pris en charge dans les navigateurs Mozilla, mais pas IE. J'ai donc commencé à chercher pour voir si quelqu'un avait écrit une sorte d'équivalent. A propos de la seule chose que j'ai trouvé a été a jQuery plugin, mais je ne suis pas sûr que ce soit la meilleure voie à suivre. J'utilise certainement jQuery dans la plupart de mes projets, donc je ne m'inquiète pas pour l'aspect jQuery ...

Quoi qu'il en soit, quelqu'un peut-il me montrer un exemple pratique de ce plugin jQuery? J'ai des problèmes pour le faire fonctionner ...

Ou, est-ce que quelqu'un sait de meilleures alternatives qui fonctionneraient par navigateur?

Mise à jour après les réponses:

Merci à tous pour les réponses! J'ai essayé le code affiché ici: http://webreflection.blogspot.com/2009/01/internet-explorer-object-watch.html

Mais je ne pouvais pas sembler le faire fonctionner avec IE. Le code ci-dessous fonctionne bien dans Firefox, mais ne fait rien dans IE. Dans Firefox, chaque fois que watcher.status est modifié, le document.write() dans watcher.watch() est appelé et vous pouvez voir la sortie sur la page. Dans IE, cela ne se produit pas, mais je peux voir que watcher.status met à jour la valeur, car le dernier appel document.write() affiche la valeur correcte (dans IE et FF). Mais, si la fonction de rappel n'est pas appelée, alors c'est inutile ... :)

Ai-je raté quelque chose?

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

(Désolé pour le cross-posting, mais cette réponse que je donnais à une question similaire fonctionne très bien ici)

J'ai créé un petit object.watch shim pour cela il y a un certain temps. Il fonctionne dans IE8, Safari, Chrome, Firefox, Opera, etc.

Answer 2

J'ai trouvé deux personnes qui prétendent avoir résolu ce problème:

Crossbrowser Object watch (soutien pour IE demandes, Opera, Safari)

watch() Missing JS Function in IE avec l'utilisation de prototype.js pour IE (Opera? , Safari?)

Answer 3

Ce plugin utilise simplement un temporisateur/intervalle pour vérifier de manière répétée les changements sur un objet. Peut-être assez bien mais personnellement je voudrais plus d'immédiateté en tant qu'observateur.

Voici une tentative pour amener watch/unwatch à IE: http://webreflection.blogspot.com/2009/01/internet-explorer-object-watch.html.

Il change la syntaxe de la manière Firefox d'ajouter des observateurs. Au lieu de:

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

Vous faites:

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

Pas aussi doux, mais à titre d'observateur, vous êtes informé immédiatement.

Answer 4

mise à jour pour la fin de 2015

Object.observe() est maintenant annulé. Désolé les gens!

Mise à jour pour 2015

Utilisez Object.observe() from ES7.

Here's a polyfill.

Answer 5

Je pense aussi que ce moment la meilleure solution est d'utiliser Watch.JS, trouver un tutoriel bien ici: Listen/Watch for object or array changes in Javascript (Property changed event on Javascript objects)

Answer 6

Notez que dans Chrome 36 et plus vous pouvez utiliser Object.observe aussi bien. Cela fait en fait partie d'un futur standard ECMAScript, et non d'une fonctionnalité spécifique au navigateur, telle que Object.watch de Mozilla.

Object.observe ne fonctionne que sur les propriétés de l'objet, mais est beaucoup plus performant que Object.watch (ce qui est destiné à des fins de débogage, pas de production).

var options = {}; 

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

options.foo = 'bar'; 

Answer 7

vous pouvez utiliser Object.defineProperty.

regarder la propriété bar dans 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 
    } 
})