38

Possible Duplicate:
Javascript Object.Watch for all browsers?

I just read Mozilla's documentation for the watch() method. It looks very useful.

However, I can't find something similar for Safari. Neither Internet Explorer.

How do you manage portability across browsers?

Community
  • 1
  • 1
Philippe
  • 1,206
  • 3
  • 13
  • 19
  • 1
    Dup: http://stackoverflow.com/questions/1029241/javascript-object-watch-for-all-browsers – Crescent Fresh Aug 13 '09 at 01:57
  • Here's a related discussion: [http://stackoverflow.com/questions/1029241/javascript-object-watch-for-all-browsers](http://stackoverflow.com/questions/1029241/javascript-object-watch-for-all-browsers) – Mehmet Duran Aug 13 '09 at 02:06

3 Answers3

68

I have created a small object.watch shim for this a while ago. It works in IE8, Safari, Chrome, Firefox, Opera, etc.

/*
* object.watch v0.0.1: Cross-browser object.watch
*
* By Elijah Grey, http://eligrey.com
*
* A shim that partially implements object.watch and object.unwatch
* in browsers that have accessor support.
*
* Public Domain.
* NO WARRANTY EXPRESSED OR IMPLIED. USE AT YOUR OWN RISK.
*/

// object.watch
if (!Object.prototype.watch)
    Object.prototype.watch = function (prop, handler) {
        var oldval = this[prop], newval = oldval,
        getter = function () {
            return newval;
        },
        setter = function (val) {
            oldval = newval;
            return newval = handler.call(this, prop, oldval, val);
        };
        if (delete this[prop]) { // can't watch constants
            if (Object.defineProperty) // ECMAScript 5
                Object.defineProperty(this, prop, {
                    get: getter,
                    set: setter
                });
            else if (Object.prototype.__defineGetter__ && Object.prototype.__defineSetter__) { // legacy
                Object.prototype.__defineGetter__.call(this, prop, getter);
                Object.prototype.__defineSetter__.call(this, prop, setter);
            }
        }
    };

// object.unwatch
if (!Object.prototype.unwatch)
    Object.prototype.unwatch = function (prop) {
        var val = this[prop];
        delete this[prop]; // remove accessors
        this[prop] = val;
    };
Eli Grey
  • 35,104
  • 14
  • 75
  • 93
  • Any reason as to why you removed it from Github? Better solution? Wasn't working? How about IE7? – keyle Aug 05 '11 at 10:25
  • 5
    It's still on Github, I just move it to a gist (https://gist.github.com/384583) due to it not really being significant enough for a repo imo. – Eli Grey Aug 05 '11 at 17:56
  • how do we use this to monitor innerHTML on DOM objects? – jchook Sep 14 '12 at 23:59
  • 3
    Does it actually work for IE8 on non DOM objects? – Greg Nov 03 '12 at 10:20
  • This does not work in Safari on certain DOM properties such as `el.style.width` – Jani Hartikainen Mar 18 '14 at 22:48
  • After using watch, i can't iterate through attributes. Maybe better to remove line with "delete this[prop]" ? – Ivan P. Oct 01 '14 at 10:01
  • IE8 shows error on line "Object.defineProperty(this, prop, {" - the command is not supported by the object. –  Dec 15 '14 at 07:45
  • @Eli Grey. I think that if your solution works in IE8 only for DOM object you MUST note it. –  Dec 15 '14 at 07:56
  • I think this code should work great for POCO object. For DOM element, you should consider attrchange library(https://github.com/meetselva/attrchange). –  Apr 27 '15 at 17:33
  • For any other object types(rather than POCO object), I think we should not use this function to detect change because it may causes a problem because most of they are native code. It should not be a good idea to modify them. –  Apr 27 '15 at 17:37
  • can't watch constants, -1 – neaumusic Jun 06 '16 at 10:15
  • when you console.log() that object, the watched property is hidden!!!! how to fix?? – Maria Jun 12 '18 at 20:45
2

Unfortunately, this is not a portable solution. IE has nothing like this to my knowledge, though it would be awesome if there was

Joel Martinez
  • 46,929
  • 26
  • 130
  • 185
-4

You could probably implement your own system of notifcation, by overwriting methods and variables. I don't see it as being that critical though, but I don't know what you planning on doing with such a system.

Noon Silk
  • 54,084
  • 6
  • 88
  • 105