一、RxJS是什么
RxJS 是一个库,它通过使用 observable 序列来编写异步和基于事件的程序。它提供了一个核心类型 Observable,附属类型 (Observer、 Schedulers、 Subjects) 和受 [Array#extras] 启发的操作符 (map、filter、reduce、every, 等等),这些数组操作符可以把异步事件作为集合来处理。
可以把 RxJS 当做是用来处理事件的 Lodash 。
ReactiveX 结合了 观察者模式、迭代器模式 和 使用集合的函数式编程,以满足以一种理想方式来管理事件序列所需要的一切。
在 RxJS 中用来解决异步事件管理的的基本概念是:
- Observable (可观察对象): 表示一个概念,这个概念是一个可调用的未来值或事件的集合。
- Observer (观察者): 一个回调函数的集合,它知道如何去监听由 Observable 提供的值。
- Subscription (订阅): 表示 Observable 的执行,主要用于取消 Observable 的执行。
- Operators (操作符): 采用函数式编程风格的纯函数 (pure function),使用像
map
、filter
、concat
、flatMap
等这样的操作符来处理集合。 - Subject (主体): 相当于 EventEmitter,并且是将值或事件多路推送给多个 Observer 的唯一方式。
- Schedulers (调度器): 用来控制并发并且是中央集权的调度员,允许我们在发生计算时进行协调,例如
setTimeout
或requestAnimationFrame
或其他。
在线demo:rxjs可视化工具
二、当下前端异步已经有async 和 promise的情况下,异步复杂到什么程度才需要使用rxjs?
要想搞清楚这个问题,首先要知道Observable 和 Promise 的区别,大概场景有:
1.直接的场景就是前端复杂状态管理,使用 RxJS 管理很容易,如果使用 Promise 就必须要借助第三方状态管理的库
那么在某些场景下区别不大,比如一个 Http 的请求,使用 RxJS Observable 比 Promise 没有质的好处,区别就是 Observable 你不订阅就不会请求,Promise 就是只要生成了 Promise 就会请求。
例如:
有n个ip,每个ip要ping最多x次,有y次成功即可停止。总共若有m个ip成功停止则停止其他未完成的请求。然后给出最快的这m个ip,按ping值从小到大排列。
看历史用promise写的代码(promise套promise)看得脑瓜疼、胃疼、想吐,生理上的。。
改用rxjs,只需30来行轻松搞定还没bug。
2.Rx 适合复杂的异步时间和数据流等,RxJS带来的一个巨大好处是解耦,使用无副作用的操作符来连接各种完整的代码逻辑,能使代码简洁清晰,维护也方便,
简单的小场景用 Rx 只是自己给自己找麻烦。而且 Rx 的侵入性特别强,基本上用了之后都是 Rx 那一套东西了。不要为了 Rx 而 Rx
3.rx 是处理「流」的,不是处理「异步」的,
每个 rxjs 的 api 就是一种场景,里面 80%场景使用 promise 难以实现或者是需要写更多的代码才可以实现
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· AI与.NET技术实操系列:基于图像分类模型对图像进行分类
· go语言实现终端里的倒计时
· 如何编写易于单元测试的代码
· 10年+ .NET Coder 心语,封装的思维:从隐藏、稳定开始理解其本质意义
· .NET Core 中如何实现缓存的预热?
· 25岁的心里话
· 闲置电脑爆改个人服务器(超详细) #公网映射 #Vmware虚拟网络编辑器
· 零经验选手,Compose 一天开发一款小游戏!
· 通过 API 将Deepseek响应流式内容输出到前端
· AI Agent开发,如何调用三方的API Function,是通过提示词来发起调用的吗