在 RxJS 中，除了 auditTime、debounceTime、throttleTime，还有其他几个常用的时间相关操作符。以下是完整的总结：
1. debounceTime
// 在指定的时间间隔内没有新值发出时才发出最新值
// 常用于搜索框输入、窗口 resize 等
input$.pipe(debounceTime(300))
2. throttleTime
// 在指定时间间隔内只发出第一个值，忽略后续值
// 常用于按钮防重复点击、滚动事件
click$.pipe(throttleTime(1000))
3. auditTime
// 在指定时间间隔内忽略值，时间结束后发出最后一个值
// 类似于 throttleTime，但发出的是时间窗口结束时的最后一个值
scroll$.pipe(auditTime(200))
4. sampleTime
// 定期采样：在固定的时间间隔发出最新的值（如果有）
// 不管源 Observable 发出多少值，只按固定频率采样
source$.pipe(sampleTime(1000))
5. bufferTime
// 将时间窗口内的值收集到数组中发出
// 可以设置窗口开启间隔和窗口持续时间
source$.pipe(bufferTime(1000, 5000))
// 每1000ms开始一个缓冲区，每个缓冲区持续5000ms
6. windowTime
// 将源 Observable 的值分割成多个时间窗口的 Observable
// 返回的是高阶 Observable
source$.pipe(windowTime(1000))
.subscribe(window$ => {
// 每个 window$ 是一个持续1秒的 Observable
})
7. delay
// 延迟发出所有值
// 保持相对时间间隔不变
source$.pipe(delay(1000))
8. delayWhen
// 根据另一个 Observable 的发出时间动态延迟
// 可以自定义每个值的延迟逻辑
source$.pipe(delayWhen(
value => timer(value.delayTime)
))
9. timeout
// 如果源 Observable 在指定时间内没有发出值，则抛出错误
source$.pipe(timeout(5000))
10. timeoutWith
// 超时时切换到备用的 Observable
source$.pipe(timeoutWith(
5000,
fallbackObservable
))
11. debounce
// 更灵活的防抖，可以自定义防抖逻辑
// 参数是一个返回 Observable 的函数
input$.pipe(debounce(
value => timer(value.length * 100) // 根据输入长度动态设置防抖时间
))
12. throttle
// 更灵活的节流，可以自定义节流逻辑
source$.pipe(throttle(
value => timer(500) // 每个值节流500ms
))
13. audit
// 更灵活的审计操作
source$.pipe(audit(
value => timer(value.duration) // 根据值动态设置审计时间
))
对比总结
| 操作符 | 行为特点 | 适用场景 |
|---|---|---|
| debounceTime | 等待静默期后发出最新值 | 搜索建议、表单验证 |
| throttleTime | 时间窗口内只发出第一个值 | 按钮防重、滚动事件 |
| auditTime | 时间窗口结束后发出最后一个值 | 拖拽操作、连续事件 |
| sampleTime | 定期采样最新值 | 监控数据、状态轮询 |
| bufferTime | 收集时间窗口内的所有值 | 批量处理、数据聚合 |
| delay | 延迟所有值发出 | 动画序列、定时任务 |
快速选择指南
- 防抖：
debounceTime（等待用户停止输入） - 节流：
throttleTime（防止按钮重复点击） - 取样：
sampleTime（定期获取最新状态） - 批量处理：
bufferTime（收集一段时间的数据） - 延迟：
delay（安排执行时间） - 超时处理：
timeout（设置响应超时）
这些操作符都用于处理时间相关的异步事件流，根据具体需求选择合适的操作符可以更优雅地处理各种场景。
