Subject 昨天我们讲到了 Subject 实际上就是 Observer Pattern 的实作,他会在内部管理一份 observer 的清单,并在接收到值时遍历这份清单并送出值,所以我们可以这样用 Subject var subject = new Rx.Subject(); var observerA = { next: value => console.log('A next: ' + value), error: error => console.log('A error: ' + error), complete: () => console.log('A complete!') } var observerB = { next: value => console.log('B next: ' + value), error: error => console.log('B error: ' + error), complete: () => console.log('B complete!') } subject.subscribe(observerA); subject.subscribe(observerB); subject.next(1); // "A next: 1" // "B next: 1" subject.next(2); // "A next: 2" // "B next: 2" JSBin 这裡我们可以直接用 subject 的 next 方法传送值,所有订阅的 observer 就会接收到,又因为 Subject 本身是 Observable,所以这样的使用方式很适合用在某些无法直接使用 Observable 的前端框架中,例如在 React 想对 DOM 的事件做监听 class MyButton extends React.Component { constructor(props) { super(props); this.state = { count: 0 }; this.subject = new Rx.Subject(); this.subject .mapTo(1) .scan((origin, next) => origin + next) .subscribe(x => { this.setState({ count: x }) }) } render() { return <button onClick={event => this.subject.next(event)}>{this.state.count}</button> } } JSBin | JSFiddle 从上面的程式码可以看出来,因为 React 本身 API 的关系,如果我们想要用 React 自订的事件,我们没办法直接使用 Observable 的 creation operator 建立 observable,这时就可以靠 Subject 来做到这件事。 Subject 因为同时是 observer 和 observable,所以应用面很广除了前面所提的之外,还有上一篇文章讲的组播(multicase)特性也会在接下来的文章做更多应用的介绍,这裡先让我们来看看 Subject 的三个变形。 BehaviorSubject 很多时候我们会希望 Subject 能代表当下的状态,而不是单存的事件发送,也就是说如果今天有一个新的订阅,我们希望 Subject 能立即给出最新的值,而不是没有回应,例如下面这个例子 var subject = new Rx.Subject(); var observerA = { next: value => console.log('A next: ' + value), error: error => console.log('A error: ' + error), complete: () => console.log('A complete!') } var observerB = { next: value => console.log('B next: ' + value), error: error => console.log('B error: ' + error), complete: () => console.log('B complete!') } subject.subscribe(o
rxjsSubject、BehiverSubject区别
最新推荐文章于 2023-03-20 22:33:12 发布