[RxJS] Transformation operators: delay and delayWhen

This lessons teaches about delay and delayWhen: simple operators that time shift.

delay(number | date)

var foo = Rx.Observable.interval(500).take(5);

/*
--0--1--2--3--4|
 delay(1000)
-----0--1--2--3--4|
*/

// delay(1000)
var result = foo.delay(1000);

result.subscribe(
  function (x) { console.log(‘next ‘ + x); },
  function (err) { console.log(‘error ‘ + err); },
  function () { console.log(‘done‘); },
);
var foo = Rx.Observable.interval(500).take(5);

/*
--0--1--2--3--4|
 delay(date)
-----0--1--2--3--4|
*/

var date = new Date(new Date().getTime() + 1000);
var result = foo.delay(date);

result.subscribe(
  function (x) { console.log(‘next ‘ + x); },
  function (err) { console.log(‘error ‘ + err); },
  function () { console.log(‘done‘); },
);

delayWhen( function :Observable): accept a function which return an observable:

var foo = Rx.Observable.interval(500).take(5);

/*
--0--1--2--3--4|
 delayWhen(x => --------0--------...)
--------0--------1--------2--------3--------4|
*/

// delay(1000)
var result = foo.delayWhen(x =>
  Rx.Observable.interval(x * 1000) // For each foo, it will delay 1000 * x, so ‘2‘ --> 2000, ‘3‘ ---> 3000
);

result.subscribe(
  function (x) { console.log(‘next ‘ + x); },
  function (err) { console.log(‘error ‘ + err); },
  function () { console.log(‘done‘); },
);
时间: 2024-10-05 04:24:14

[RxJS] Transformation operators: delay and delayWhen的相关文章

[RxJS] Creation operators: interval and timer

It is quite common to need an Observable that ticks periodically, for instance every second or every 100 miliseconds. We will learn about operators interval() and timer(), both of which are similar to setInterval() in JavaScript. Interval(period): Yo

[RxJS] Transformation operator: scan

All of the combination operators take two or more observables as input. These operators may also be alternatively called "vertical combination operators", because of how they work in a marble diagram. Next, we will learn about scan(), which is a

[RxJS] Creation operators: empty, never, throw

This lesson introduces operators empty(), never(), and throw(), which despite being plain and void of functionality, are very useful when combining with other Observables. empty: var foo = Rx.Observable.empty(); // the same as var foo = Rx.Observable

[RxJS] Transformation operator: repeat

Operator repeat() is somewhat similar to retry(), but is not for handling operators. In this lesson we learn how repeat works. var foo = Rx.Observable.interval(500) .zip(Rx.Observable.of('a','b','c','d'), (x,y)=>y); var bar = foo.map(x => x.toUpperC

[RxJS] Transformation operator: map and mapTo

We made our first operator called multiplyBy, which looks a bit useful, but in practice we don't need it because it's too specific: it only does simple multiplication on numbers. In this lesson we will see how the map() operator is useful for any cal

[RxJS] Creation operators: from, fromArray, fromPromise

The of() operator essentially converted a list of arguments to an Observable. Since arrays are often how we structure list of things in JavaScript, we should have a way of transforming arrays into Observables. This lesson teaches how you can convert

[RxJS] Filtering operators: throttle and throttleTime

Debounce is known to be a rate-limiting operator, but it's not the only one. This lessons introduces you to throttleTime and throttle, which only drop events (without delaying them) to accomplish rate limiting. throttleTime(number): first emits, then

[RxJS] Filtering operators: distinct and distinctUntilChanged

Operator distinct() and its variants are an important type of Filtering operator. This lessons shows how they work and in what cases are they useful. distinctUntilChanged(): var foo = Rx.Observable.interval(500).take(5) .zip(Rx.Observable.of('a','b',

[RxJS] Combination operators: concat, startWith

Some Observables may complete, and we may want to append another Observable to the one which just completed. This lesson teaches you how to use the concat() operator for either appending or prepending, and how the shortcut operator startWith() is an