RxJS 是一个强大的 JavaScript 库，它可以用来处理异步数据流，用了 RxJS，你可以快速地开发出各种异步应用程序。这个库中有一个很重要的概念，叫做 Scheduler，今天我们就来详细了解一下 RxJS schedulers。
Scheduler 是什么？
Scheduler 是一个概念性的抽象，它实际上是一个用于调度任务执行的对象。它通常用于将任务延迟执行，或将其放置在另一个线程上执行。在 RxJS 中，Scheduler 是用来控制 Observable 发生的时间和顺序的。如果你曾经使用过 setTimeout 或者 setInterval 等 JavaScript 原生的定时器，那么 Scheduler 就是一个类似于定时器的东西。通过 Scheduler，你可以在指定的时间运行 Observable，这就给了你更多调度任务的灵活性。
Scheduler 可以让你控制 Observable 的执行，具体来说，你可以在 Observable 的执行过程中使用 Scheduler 来：
- 延迟 Observable 的执行；
- 控制 Observable 的执行顺序；
- 将 Observable 的执行置于另一个线程或 Web Worker 中。
RxJS 自带的 Schedulers
RxJS 提供了三种内置的 Scheduler：
1. AsapScheduler
AsapScheduler 使用 HTML5 的 MutationObserver API 在宏任务和微任务之间切换，以确保所有 Observable 在宏任务之间执行，让 Observable 尽可能快地执行。
import { asapScheduler } from 'rxjs'; const observable = of(1, 2, 3, asapScheduler); observable.subscribe(val => console.log(val)); // 1 2 3
2. QueueScheduler
QueueScheduler 使用了一个简单的队列来调度 Observable 的执行。在使用平台 API 之前，QueueScheduler 会一直等待直到当前执行已完成。
import { queueScheduler } from 'rxjs'; const observable = of(1, 2, 3, queueScheduler); observable.subscribe(val => console.log(val)); // 1 2 3
3. AsyncScheduler
AsyncScheduler 将任务放在异步队列中，等待下一帧的渲染，确保异步任务在下一个执行帧中执行。它实际上是将你的任务或 Observable 推入 requestAnimationFrame(callback)，来保证异步任务在异步队列中保持活动状态。
import { asyncScheduler } from 'rxjs'; const observable = of(1, 2, 3, asyncScheduler); observable.subscribe(val => console.log(val)); // 1 2 3
自定义 Scheduler
RxJS 的 Scheduler 提供了多种预定义的实现，但我们也可以创建自己的 Scheduler。Scheduler 是一个非常抽象的概念，我们需要先理解 Scheduler 的核心思想。
在 RxJS 中，所有工作都由 Observable 执行。Scheduler 的作用是根据我们指定的条件来告诉 Observable 何时开始执行。
我们可以通过调用：Observable.SubscribeOn(scheduler) 来改变执行的 Scheduler。
下面是一个自定义 Scheduler 的示例：
-- -------------------- ---- ------- ------ - ---------- - ---- ------- ----- ----------- - - --------- -------------- ----- - -- - ----- -------- - ----- - ----- ---------------- ---------- - - ----- ---------- - --- ------------------- -- - -------------------- --------- --- ------------------------------------------------- -- ------------------展开代码
上面代码中，我们定义了一个名为 myScheduler 的 Scheduler 对象，其 schedule 函数会将任务延迟指定的时间后再执行。接着，我们使用这个自定义 Scheduler 来订阅一个 Observable，并输出 Observable 的结果，就像前面示例代码那样。
结语
RxJS 的 Scheduler 是一个非常强大的概念，它可以让你更加精细地控制你的 Observable。当你需要降低任务执行的优先级或者更好地微调性能以避免瓶颈时，Scheduler 可以给你提供很大的帮助。不断了解和学习这些概念将有助于成为一名优秀的前端工程师。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/67ba69fa306f20b3a69219ad
