且构网

分享程序员开发的那些事...
且构网 - 分享程序员编程开发的那些事

Angular应用里使用rxjs提供的观察者和发布者实现事件处理

更新时间:2022-09-14 20:28:34

比SAP的UI5 event bus要复杂些


调用栈1:应用代码里,抛出sendData的事件,参数为下图调试器里的json对象:


Angular应用里使用rxjs提供的观察者和发布者实现事件处理


调用栈2:还是在应用层代码内:


this._eventBus = new Subject();


Angular应用里使用rxjs提供的观察者和发布者实现事件处理


broadcast方法的实现是将执行转交给this._eventBus.


调用栈3:典型的观察者-发布者模式,遍历当前所有观察者,调用next方法



Angular应用里使用rxjs提供的观察者和发布者实现事件处理

调用栈4: 执行订阅者原型链上的next方法:


Angular应用里使用rxjs提供的观察者和发布者实现事件处理


调用栈5:执行FilterSubscriber原型链上的next方法:


Angular应用里使用rxjs提供的观察者和发布者实现事件处理


调用栈6:执行MapSubscriber原型链上的next方法:



Angular应用里使用rxjs提供的观察者和发布者实现事件处理

调用栈7:执行SafeSubscriber原型链上的next方法:


Angular应用里使用rxjs提供的观察者和发布者实现事件处理


最终执行到应用层里的观察者的对应方法:



Angular应用里使用rxjs提供的观察者和发布者实现事件处理

通过这张图来理解:

Angular应用里使用rxjs提供的观察者和发布者实现事件处理