javascript - 在 JavaScript 中订阅 map 数据结构不起作用

Question

我一直在尝试观察 JavaScript 中 map 对象的变化，但由于某种原因只能观察对象的创建。从 map 添加/删除数据时，可观察对象不起作用吗？

这是可观察到的:

  test(): Observable<Map<string, Object>> {
    return of(this.testModel.test());
}

这是我订阅的:

test(): Observable<Map<string, Object>> {

let mapOb = this.testModel.test();
    return Observable.create((obsrvr) => {
      const originalSet = mapOb.set;
      const originalDelete = mapOb.delete;
      mapOb.set = (...args) => {
        obsrvr.next(originalSet.call(mapOb, ...args));
      };

      mapOb.delete = (...args) => {
        obsrvr.next(originalDelete.call(mapOb, ...args));
      }
    });
}

我在创建 map 期间看到日志语句，但是如果我向 map 添加任何新条目，则不会记录任何内容。有人知道为什么会发生这种情况吗？

我在 maoOb.set 和 mapOb.delete 处收到错误:

Type '(key: string, value: Object) => void' is not assignable to type '(key: string, value: Object) => Map<string, Object>'.
  Type 'void' is not assignable to type 'Map<string, Object>'

Answer 1

当您想监听 map 中数据的添加/删除时，您当前的方法似乎不正确。

您只是使用of(Object Reference)返回一个Observable，这将无法知道您正在对传递给它的对象执行的操作。

您需要有一个 Observable，当您对 MapInstance 执行 set() 或 delete() 时，该 Observable 会发出。

您可以通过这种方式修改您的 Map 实例来实现您想要的。

createObservable(mapOb) {
  return Observable.create((obsrvr) => {
    const originalSet = mapOb.set;
    const originalDelete = mapOb.delete;
    mapOb.set = (...args) => {
      const setReturn = originalSet.call(mapOb, ...args);
      obsrvr.next(setReturn);
      return setReturn;
    };

    mapOb.delete = (...args) => {
      const deleteReturn = originalDelete.call(mapOb, ...args);
      obsrvr.next(deleteReturn);
      return deleteReturn;
    }
  });

}

将 map 传递给 createObservable() 方法并订阅它。在此方法中，我修改了 map 的 set 和 delete 方法，以便在调用这些方法时它会发出一个值。

我为答案创建了一个虚拟示例:Link.