javascript - RxJS 先 take 然后 throttle 等待

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。

与 throttle 不同，无论是否发出最后接收到的值，都会计算值之间的时间延迟。使用 throttle ，将发送 0，将经过 200 毫秒，将评估 1 并失败，将经过 400 毫秒，将评估 2 并通过，因为最后一个发出值 (0) 和当前接收到的值 (2) 之间经过了时间) 是 600 毫秒，而对于我的运算符(operator)，它将相对于 1 进行评估，耗时将是 400 毫秒，因此测试失败。

而且这个运算符也没有去抖动。它不是等到间隔结束才发出，而是先发送第一个值，然后根据所有 future 值进行评估，依此类推。

这样的运营商是否已经存在？如果没有，我将如何着手制作一个？

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)})