rxjs-windowTime,groupBy,pluck,sc

Rx_Logo-512-512.png

1.windowTime

windowTime称为窗口函数，它的作用通常用来定时统计最近一段时间情况。例如每天统计1次最近30天数据情况。

类似于buffer，不同点是buffer将缓存的数据发射出去后就没有了，而window前后发射的数据有可能有重叠的部分。

于window有关的操作符有window,windowTime,windowCount,windowToggle,windowWhen。这里只介绍windowTime-时间窗口

案例，每秒统计一次近5秒的点击情况。

分析：每秒统计一次意味着每秒钟要发射一次，近5秒的情况意味着窗口的大小有5秒的长度

import { fromEvent } from 'rxjs';
import { windowTime, mergeMap, toArray } from "rxjs/operators";
fromEvent(document, "click").pipe(
  windowTime(5000, 1000),
  mergeMap(x => x.pipe(toArray()))
).subscribe(x => console.log(x));

因为windowTime操作符返回值不是一个数组而是一个数据源，所以进行了转换操作。

第一个参数代表窗口的长度，以毫秒计算，所以是5秒的窗口。

第二个参数代表窗口移动的时间，以毫秒计算，所以是1秒发射一次统计结果。

2. groupBy

groupBy是分组操作符，按照统一的规则将数据源分组成不同的数据源

import { of } from 'rxjs';
import { mergeMap, toArray, groupBy } from "rxjs/operators";
of(1,2,3,4,5,6).pipe(
  groupBy(_=>_%2),
  mergeMap(x=>x.pipe(toArray()))
).subscribe(_=>console.log(_))

groupBy将数据源进行了分组变成了2个数据源

mergeMap用于将上一步生成的数据源变成基本数据类型

toArray用于将数据源变成数组

3. pluck

参考map

pluck可以取出每一个对象中的某一个属性值

案例：数据源是用户数组，取出用户的名称并发射出来

• 用map实现

import { from } from 'rxjs';
import { map } from "rxjs/operators";    
from([{name:'张三',age:12},{name:'李四',age:13}]).pipe(
    map(x=>x.name)
).subscribe(x=>console.log(x))

• 简写，用pluck实现

import { from } from 'rxjs';
import { pluck } from "rxjs/operators";   
from([{name:'张三',age:12},{name:'李四',age:13}]).pipe(
    pluck("name")
).subscribe(x=>console.log(x))

4. scan

scan类似于累加函数，它发射每一次计算后的累加结果，并将结果缓存给下一次计算。

import { interval } from 'rxjs';
import { scan } from "rxjs/operators";
interval(1000).pipe(
  scan((acc,now)=>acc+now,0)
).subscribe(x=>console.log(x))

解释：scan接收一个函数和一个初始值seed，这个函数有两个参数(acc,now)，同时返回一个值。第一个参数acc是上一次的累加结果，第二个参数now是当前外部数据源传递过来的数据，返回值是上一次累加结果和当前值的和，也就是累加过程。

因为第一次外部传递数据过来的时候是没有上一次的累加结果acc的，所以第二个参数seed就是第一次计算时的acc。

因此

第一次的计算过程就是0(seed)+0(now)=0(newAcc)

第二次的计算过程就是0(acc)+1(now)=1(newAcc)

...

5. pairwise

pairwise的作用时将当前值和上一次的值组成数组传递出去

import { interval } from 'rxjs';
import { pairwise } from "rxjs/operators";
interval(1000).pipe(
  pairwise()
).subscribe(x=>console.log(x))

外部源第一次发射值时pairwise函数不会将值发射出去，当外部源第二次发射值时pairwise开始组合上一次和本次的数据发射出去。