RxJS先取，然后节流并等待

Question

我希望使用RxJS-DOM观察mousewheel事件，这样当第一个事件触发时，我会将其转发，然后丢弃任何和所有值，直到后续值之间的延迟超过先前指定的持续时间。

我想象中的运算符可能类似于：

Rx.DOM.fromEvent(window, 'mousewheel', (e) => e.deltaY)
.timegate(500 /* ms */)

想象一下下面的数据流：

0 - (200 ms) - 1 - (400ms) - 2 - (600ms) - 3

其中发送的值是数字，时间描述下一个值到达所需的时间。由于0是第一个值，因此它将被发出，然后直到3的所有值都将被丢弃，因为后续值之间的单个延迟不大于500ms。

与节流不同，无论是否发出最后接收的值，都会计算值之间的时间延迟。使用节流，将发送0，将流逝200毫秒，将评估1并失败，将流逝400毫秒，将评估并通过2，因为在最后一个发射值(0)与当前接收的值(2)之间流逝的时间是600毫秒，而使用我的操作员，它将相对于1进行评估，并且流逝的时间将是400毫秒，因此测试失败。

这个运算符也不是去反跳的。它首先发送第一个值，然后根据所有未来的值进行计算，以此类推，而不是等到间隔过后才发出。

像这样的操作符已经存在了吗？如果不是，我该怎么做呢？

Answer 1

使用timeInterval运算符可以相对容易地实现这一点，该运算符可以精确地计算连续值之间的时间间隔。下面是一个示例代码，您可以根据自己的伪装进行调整。

http://jsfiddle.net/a7uusL6t/

var Xms = 500;
var click$ = Rx.Observable.fromEvent(document, 'click').timeInterval()
var firstClick$ = click$.first().map(function(x){return x.value});

var res$ = firstClick$
  .concat(click$
    .filter(function (x) {
      console.log('interval', x.interval);
      return x.interval > Xms;})
    .map(function(x){return x.value})
   );

res$.subscribe(function(x){console.log(x)})

Answer 2

我用类似但比@user3743222的答案更精致的方法解决了我的问题：

const events = Rx.Observable.fromEvent(window, 'mousewheel', (e) => e.deltaY);
const firstEventObservable = events.take(1);
const remainingEventsObservable = events.skip(1)
    .timeInterval()
    .filter(x => x.interval >= this.props.delayDuration)
    .map(x => x.value);
const pageChangeObservable = firstEventObservable.concat(remainingEventsObservable);