1. debounce(防抖)

1.1 描述:

根据一个选择器函数,舍弃掉在两次输出之间小于指定时间的发出值。(在一定时间范围内只要最后一个值)
(使用场景:用户的输入频率不确定)

  1. of([1,2,3].pipe(
  2. debounce(() => timer(1000)); // 发送完最后一次后, 一秒后输出
  3. ).subscripe(res => console.log(res))

1.3 debounce的衍生操作符

1.3.1 debounceTime

舍弃掉在两次输出之间小于指定时间的发出值(使用场景:知道用户的输入频率)

fromEvent(input, 'keyup').pipe(
  debounceTime(1000) // 舍弃1秒内所有值
)

1.3.2 distinctUntilChanged

只有当 当前值与之前最后一个值不同时才将其发出(默认使用 === 进行比较, 对象引用必须匹配)

of([1,1,2,3,2,2]).pipe(
  distinctUntilChanged() // 还可以发出不同对象
)

2. filter

发出符合给定条件的值。(使用场景:与Array的filter一致)
在某些条件下, 可用skip简写

3. first 与 last

发出第一(最后)个值或第一(最后)个通过给定表达式的值。(使用场景:满足某条件时,第一个/最后一个)

of([1,2,3]).pipe(
  first(num => num === 1) // 或first()
)

4. single(初始化有用)

发出通过表达式的单一项。该 Observable 发出源 Observable 所发出的值中匹配指定 predicate 函数的单个项。 如果源 Observable 发出多于1个数据项或者没有发出数据项, 分别以 IllegalArgumentException 和 NoSuchElementException 进行通知。

// 若果没匹配上,返回undefined
// 如果在监听流里发出多个Observable会发出错误捕获
// 返回一个 Observable,它判断源 Observable 是否只发出一个与断言匹配的值。
// 如果没有提供断言,那么它将判断 Observable 是否只发出一个值

of('初始化').pipe(
  single(str => str === '初始化') // 执行此条件,跳过其他条件
)

range(1,5).pipe(single(x => x === 10)).subscribe(x => console.log(x))

5. skip

跳过N个(由参数提供)发出值 (数据源),某些条件下可当做filter (index)的简写
(使用场景:不需要初始值,比如使用BehaviorSubject)

5.1 skip的衍生操作符

5.1.1 skipUntil

跳过源 observable 发出的值,直到提供的 observable 发出值。(会丢弃源的数据,基于observable )

interval(1000).pipe(
  skipUntil(timer(2000)) // 2秒前的跳过,直到发出值,,写条件将会不执行
)

5.1.2 skipWhile

跳过源 observable 发出的值,直到提供的表达式结果为 false ;(不满足表达式往下执行,基于逻辑)

interval(1000).pipe(
  skipWhile(val => val<2) // 小于2的值跳过,,结果不为boolean程序挂掉
)

6. take

在完成前发出N个值(N由参数决定) (与skip相反),接受值
(使用场景:想要用户首次的操作数据)

6.1 take的衍生操作符

6.1.1 takeUntil

6.1.2 takeWhile

7. throttle(节流)

以某个时间间隔为阈值,在 durationSelector(持续时间选择器) 完成前将抑制新值的发出
(时间后,不取新)

import { interval } from 'rxjs';
import { throttle, map } from 'rxjs/operators';

// 每1秒发出值
const source = interval(1000);
// 基于 source 自增地增加解析的时间
const promise = val =>
  new Promise(resolve =>
    setTimeout(() => resolve(`Resolved: ${val}`), val * 100)
  );
// 当 promise 解析时发出 source 的项
const example = source.pipe(
  throttle(promise),
  map(val => `Throttled off Promise: ${val}`)
);

const subscribe = example.subscribe(val => console.log(val));

7.1 throttle的衍生

7.1.1 throttleTime

当指定的持续时间经过后发出最新值。(节流结束前发出的最后一个值将从源 observable 中发出)
(时间前,取新)

*

ignoreElements

sample

当提供的 observable 发出时从源 observable 中取样(间隔一段时间内取得的值)
(使用场景:暂无)

interval(1000).pipe(
  sample(interval(2000)) // 2秒取一下值
)