如何使用rxjs观察对象更改5

yuv*_*.bl 8 javascript rxjs rxjs5

我想监视一个对象,所以所有订阅者都会被告知它的任何变化.

之前已经看到它已被问过,但答案是无关紧要的,因为RXjs版本5不再包含其API中的ofObjectChanges.

我看过一些"hacks",比如创建一个返回函数的观察者:

let myObservable =  new Observable((observer) => {
  return (data) => {
    observer.next(data)
  }
}) 
//...
myObservable.subscribe()('someData')
Run Code Online (Sandbox Code Playgroud)

但是,我确信有更优雅的方式.有任何想法吗?

Fed*_*ssi 6

ES6观察对象的方式是使用Proxies.您创建一个包装原始对象并在其上完成工作的代理.您可以使用它来创建类似的东西Observable.ofObjectChanges.这里是部分实现(仅限set.您需要实现其他陷阱):

Observable.ofProxyChanges = (target) => {
  let subject = new Subject
  let proxy = new Proxy(target, {
    set(target, key, val) {
      let oldValue = target[key]
      target[key] = val
      subject.next({
        type: oldValue === undefined ? "add" : "change",
        object: target,
        name: key,
        oldValue: oldValue
      })
    }
  })
  return [proxy, subject.asObservable()]
}

let [obj, objChange$] = Observable.ofProxyChanges({})
objChange$.subscribe(console.log)

obj.bar = 1 // logs { type: "add", name: "bar", object: { bar: 1 } }
obj.foo = 2 // logs { type: "add", name: "foo", object: { bar: 1, foo: 2 } }
obj.foo = 3 // logs { type: "change", name: "foo", object: { bar: 1, foo: 3 }, oldValue: 2 }
Run Code Online (Sandbox Code Playgroud)