RxJS速记笔记3-Operators
閱讀時間:全文 850 字,預估用時 5 分鐘
創作日期:2020-04-18
上篇文章:RxJS速记笔记4-Subject
BEGIN
RxJS的数据处理工具集合
- 引入方式:
import { name } from 'rxjs/operators';
- 使用方式(放在pipe里面):
observable.pipe(map(x => x), ...);
常用工具函数有如下:
// 与原生map函数类似
map(x => x)
// map是处理每个值, mapTo是返回固定值
mapTo(val)
// 与原生filter函数类似
filter(x => bool)
// 取前面数个值
take(val: number)
// 取后面数个值
takeLast(val: number)
// 取第一个值, 相当于take(1)
first()
// 取最后一个值, 相当于takeLask(1)
last()
// 传入observable, 触发时即停止
takeUntil(observable)
// 连接所有observable, 比如map函数返回新的observable, 顺序处理
concatAll()
// 将多个observable连接成一个, 参数为observable
concat(observable1, observable2, ...)
// 集成concatAll和map的功能, 第一个参数返回需要合并的observable, 第二个参数看文档
concatMap(x => observable, (outerObs, interObs, outerIdx, interIdx) => val)
// 和concat的区别是, concat连接之后前一个comlete后才执行后一个, 而merge不用
merge(observable1, observable2, ...)
// 与concatAll类似, 区别是同时处理, 传入参数为最大同时处理数量
mergeAll(num: number)
// 集成mergeAll和map的功能, 使用与concatMap类似
mergeMap(x => observable, (outerObs, interObs, outerIdx, interIdx) => val)
// 与concatAll和mergeAll相似, 只执行最新的一个, 当有最新的时就取消旧的订阅
switch()
// 集成switch和map的功能, 使用与concatMap类似
switchMap(x => observable, (outerObs, interObs, outerIdx, interIdx) => val)
// 在最前塞入要发送的值, 参数为具体的值
startWith(val1, val3, ...)
// 跳过前面数个值
skip(val: number)
// 缓存最后一个传参的overvable的值与当前值一起传给回调
combineLatest(observable, (val1, val2) => val)
// 根据执行时下标位置值进行组合
zip(observable, (val1, val2) => val)
// 感觉与combineLatest功能类似
withLatestFrom(observable, (val1, val2) => val)
// 与原生reduce函数类似
scan((origin, next) => origin + next, origin)
// 缓存主observable的值, 在从observable触发时输出, 返回值的集合
buffer(observable)
// 时间缓存, 参数为毫秒值, 与buffer类似, 应用: 双击
bufferTime(val: number)
// 数量缓存, 与buffer类似
bufferCount(val: number)
// 延时处理, 影响最开始, 参数为毫秒值或Date数据, 传入Date就相当于定时处理
delay(val: number | Date)
// 延时处理, 影响每一个, 需要回传一个observable, 如: empty().pipe(delay(1000))
delayWhen(val => observable)
// 传入毫秒数, 缓存observable最后的值, 当执行在时间后无新的返回, 缓存的值输出, 应用: 输入框输入
debounceTime(val: number)
// 传入observable, 功能与debounceTime类似
debounce(observable)
// 传入毫秒数, 控制最高频率, 在一定时间内只触发一次
throttleTime(val: number)
// 传入observable, 功能与throttleTime类似
throttle(observable)
// 过滤重复值, 可以不传参数, 第一个参数为取值函数, 第二个参数传入observable为清理缓存的触发条件
distinct(callback?: val => ans, observable)
// 功能与distinct类似, 与前一个对比过滤重复
distinctUntilChanged()
// 捕捉报错回传新的observable, 第一个参数是错误信息, 第二个参数为当前observable, 如果回传第二个参数则重新执行(相当于retry()), 如果如果回传empty()则直接complete
catch((err, self: observable) => observable)
// 捕捉报错后重新执行, 参数为次数, 超出次数后才报错, 不带参数则无限循环
retry(num?: number)
// 将报错的item生成observable并重新处理, 如增加delay延时
retryWhen((obj: observable) => observable)
// 与retry类似, 区别是不依赖报错
repeat(num?: number)
FINISH
上篇文章:RxJS速记笔记4-Subject