Javascript监视变量变化

大家应该知道，在C#中对于属性、文件等的更改监视非常简单，因为有委托（事件）、FileSystemWatcher等好东东扶持。

那么在JavaScript中，如何对变量的更改进行监视呢？首先，我仿照c#的属性来对JS进行操作，写出了如下的示例：

 1       function Class1()
 2       {
 3          var oldValue='';
 4          var name='xu';
 5          var id='1';
 6          this.setName=function(n)
 7          {
 8             oldValue=name;
 9             name=n;
10             this.propertyChange('name',oldValue,n);
11          }
12          this.setID=function(n)
13          {
14              oldValue=id;
15              id=n;
16              this.propertyChange('id',oldValue,n);
17          }
18          this.display=function()
19          {
20             alert(name+'\'s id is :'+id);
21          }
22       }
23       Class1.prototype={
24          propertyChange:function(propertyName,oldValue,newValue)
25          {
26             alert(propertyName+'\'s value changed from '+oldValue+' to '+newValue);  
27          }
28       };
29 
30       var c=new Class1();
31       c.setName('xu22');
32       c.setID('5');
33       c.display();

 

 将对对象内部变量（私有变量）的赋值操作提取到了方法中，而在该方法中触发相应的变量值更改回调方法。

按说这样搞就能监视变量 的更改了，但是在FireFox的官方网站上有一个叫Object.watch(unwatch)的东东，可以用来监视变量的变更。

非常可惜的是，这个方法在IE等浏览器下不能正常运行。俺到网上搜了一番，在

http://stackoverflow.com/questions/1269633/javascript-watch-for-object-properties-changes

中找到如下东东： 

 1 if (!Object.prototype.watch)
 2 {
 3     Object.prototype.watch = function (prop, handler) 
 4     {
 5         var oldval = this[prop], newval = oldval,
 6         getter = function ()
 7         {
 8             return newval;
 9         },
10         setter = function (val) 
11         {
12             oldval = newval;
13             return newval = handler.call(this, prop, oldval, val);
14         };
15         if (delete this[prop])
16         { 
17             if (Object.defineProperty) // ECMAScript 5
18             {           
19                  Object.defineProperty(this, prop, {get: getter,set: setter});
20             }
21             else if (Object.prototype.__defineGetter__ && Object.prototype.__defineSetter__) 
22             {
23                  Object.prototype.__defineGetter__.call(this, prop, getter);
24                  Object.prototype.__defineSetter__.call(this, prop, setter);
25             }
26         }
27     };
28 }
29 
30 if (!Object.prototype.unwatch)
31 {
32     Object.prototype.unwatch = function (prop) 
33     {
34         var val = this[prop];
35         delete this[prop]; 
36         this[prop] = val;
37     };
38 }

 

 通过__defineSetter__来对赋值操作监听~~~

OK，好东西。收藏。