angular-rxjs的Subject和Observable的
2020-11-30 本文已影响0人
姜治宇
rxjs是个独立的库,里面涉及的东西挺多,其中比较常见的除了Observable,还有Subject。
Subject是一种广播机制,多人可以订阅一个Subject,然后Subject发布一条信息,全体订阅者都可以接收到,或者你可以理解成微信公众号(subject)和用户(subscribe)的关系,在微信公众号发布一条消息,全体用户都可以接收到,这就是Subject要实现的事情。
下面演示一下具体用法。
import { Subject } from 'rxjs';
var subject = new Subject();
subject.subscribe({
next: (v) => console.log('observerA: ' + v)
});
subject.subscribe({
next: (v) => console.log('observerB: ' + v)
})
subject.next(1);
subject.next(2);
执行结果:
observerA: 1
observerB: 1
observerA: 2
observerB: 2
可以看到,当subject发布一条消息后,A和B都收到了。
那Subject和Observable有啥区别呢?
Subject和Observable最大的不同之处在于,Observable只能玩一对一,而Subject是一对多。
import { Subject, Observable } from 'rxjs';
let ob = new Observable((observer) => {
setTimeout(() => {
observer.next({ msg: 'Observable发布消息啦' }) // 发布消息
}, 1000)
})
//Observable无论何时订阅都可以哦~~
setTimeout(() => {
ob.subscribe(res => {
console.log('2s后,订阅者A:', res);
})
}, 2000)
setTimeout(() => {
ob.subscribe(res => {
console.log('3s后,订阅者B:', res);
})
}, 3000);
let subject = new Subject();
//Subject发布了消息,但是如果你延后订阅,就收不到消息
setTimeout(() => {
subject.next({ msg: 'Subject发布了一条消息' });
}, 1000);
//下面的这俩哥们一个都没执行到
setTimeout(() => {
subject.subscribe({
next: (v) => console.log('订阅者AA>>> ' + v)
});
}, 2000);
setTimeout(() => {
subject.subscribe({
next: (v) => console.log('订阅者BB>>> ' + v)
})
}, 3000);
执行结果:
2s后,订阅者A: {msg: "Observable发布消息啦"}
3s后,订阅者B: {msg: "Observable发布消息啦"}
Observable是发布者和订阅者必须配对,订阅者无论何时订阅发布者都可以执行到;而Subject不是,一旦发布了消息,如果你延时接收,那对不住,一旦错过就接收不到了。