JavaScript监视从对象中删除监视的值

我试图观察一个对象的值，如果它改变了，那么一些东西

这就是我的目标

var list = [{
   object: undefined,
   index: 0,
   src: 'url here',
   active: { val: 0 }
}]

因此，当我从上面创建一个新对象时，我激活了一个额外的对象，但将

激活

值设置为上面的值，这会在两个对象之间保留此对象的引用

var newList = [];
newList.push({
  object: undefined,
  index: 0,
  src: list[i].src,
  active: list[i].active // Use reference to old list
});

因此，我试图观察

活动的
值，如下所示：

(list.active).watch('val', function() {
  if (list.active.val === 1) {
    console.log('active');
    list.object.classList.add('active');
  } else {
    console.log('not active');
    list.object.classList.remove('active');
  }
});

但是，当我查看此值时，它似乎正在被删除，就像我从
列表中注销
一样，然后该值被设置为未定义！添加监视事件后，我正在更改
list.active.val
的值

这是我用于手表功能的Polyfill

// object.watch
if (!Object.prototype.watch) {
  Object.defineProperty(Object.prototype, "watch", {
    enumerable: false,
    configurable: true,
    writable: false,
    value: 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
        Object.defineProperty(this, prop, {
          get: getter,
          set: setter,
          enumerable: true,
          configurable: true
        });
      }
    }
  });
}

// object.unwatch
if (!Object.prototype.unwatch) {
  Object.defineProperty(Object.prototype, "unwatch", {
    enumerable: false,
    configurable: true,
    writable: false,
    value: function (prop) {
      var val = this[prop];
      delete this[prop]; // remove accessors
      this[prop] = val;
    }
  });
}

编辑1

添加了proxy observe Polyfill，但这看起来并不是静止的，我添加了如下内容：

list[0] = Object.observe(list[0], function(changeset) {
  console.log('changed');
});

列表[0]。active
包含对象
{val:0}
，因此它应该正在观察此对象

没有任何错误，只是什么都没做，想法
 您不需要实现自定义的
监视/取消跟踪
功能，
Ecmascript 2015
已经提供了一个特定的api：

有大量的多边形填充可以使它在传统浏览器上工作

有一个名为
Object的提案。请观察
以满足您的需要，您可以在此处找到一个
代理
移植：

下面是一个基本的工作示例：


//您的可观察目标
const target=Object.create（空）；
常量观察者={
设置（目标、键、值）{
log（`我们应该将'${value}'设置为'${key}'属性的值吗？`）
目标[键]=值；
},
};
const observable=新代理（目标、观察者）；
observable.someKindOfProperty='Hello World'
可以作为数组访问
列表
，但它不是。另外，我想知道变量
I
是什么。您的
处理程序应该返回新值。这是一个相当长的Polyfill，但是有287行，这是我需要的，因为这将需要处理IE。问题是什么？Polyfilling总是比自定义实现更好，因为它允许您使用标准api，而新浏览器不需要polyfillis。啊，是的，我已经对我的帖子进行了编辑，请您回顾一下。请看一下
代理
是如何工作的：