观察 ES6 地图和集合的变化



有什么方法可以观察ES6地图和集合的添加和删除吗?Object.observe 不起作用,因为它仅适用于观察对象的直接属性。假设可以观察到size属性,但不会提供确切变化的迹象。另一个想法是用代理版本替换对象的setget函数。有没有更好的方法?如果没有,我很惊讶在为 ES6 编写提案时没有人想到这一点。

不,没有办法用原版地图/集来做到这一点。一般来说,单独观察对象属性是有争议的(这就是为什么Object.observe只是一个提案,而不是规范的公认部分)。观察私有状态,就像地图或集合(或日期或承诺,就此而言)的内部一样,绝对不在桌面上。

另请注意,由于size是 getter,而不是数据属性,因此Object.observe不会通知您对其的更改。

正如你提到的,你可以通过突变体和观察者之间的协作来实现这样的"观察"。您可以使用普通的 Map/Set 加上侧通道(例如返回{ Map, EventEmitter }对象的函数)来执行此操作,也可以通过为此目的定制的子类或为此目的创建的特定实例来执行此操作。

Set/Map的子类目前不起作用。这种方法怎么样(只是仓促的例子)?

//ECMAScript 2015
class XMap
{
  constructor(iterable, observer = null)
  {
    this._map      = new Map(iterable);
    this._observer = observer;
    this._changes  = {};
  }
  set(key, value)
  {
    this._changes.prev = this._map.get(key);
    this._changes.new  = value;
    this._map.set(key, value);
    if(this._observer !== null)
    {
      this._observer(this._changes);
    }
  }
  get(key)
  {
    return this._map.get(key); 
  }
}
var m = new XMap([[0, 1]], changes => console.log(changes));
m.set(0,5);  // console: Object {prev: 1, new: 5}
m.set(0,15); // console: Object {prev: 5, new: 15}

最新更新