kharandziuk kharandziuk - 27 days ago 11
Javascript Question

buffered withLatestFrom

I need something similar to withLatestFrom which corresponds to a diagram below:

---------A-----------------B--
-1-2-3------4------5-6-7-8----

--------[A,[123]]---------------[B,[45678]]


Is there any way to implement such behavior with RxJS?

Answer

I apologise that I'm not a javascript coder, but this works in .NET. Hopefully you can translate.

var xs = new Subject<string>();
var ys = new Subject<string>();

var qs =
    xs.Publish(pxs =>
        ys.Buffer(() => pxs)
            .Zip(pxs, (numbers, letter) => new { letter, numbers }));

The .Publish(pxs => operator takes a single observable, subscribes to it only once and shares that subscription within the lambda. It prevents multiple subscriptions of the source and synchronizes the production of the values from pxs within the lambda.

The ys.Buffer(() => pxs takes all values of ys and turns the values into a series of lists broken up at the point when pxs produces values.

Finally the .Zip(...) takes the values from pxs and pairs them up with the lists produced by .Buffer(...).

qs.Subscribe(q => Console.WriteLine(q));

ys.OnNext("1");
ys.OnNext("2");
ys.OnNext("3");
xs.OnNext("A");
ys.OnNext("4");
ys.OnNext("5");
ys.OnNext("6");
ys.OnNext("7");
ys.OnNext("8");
xs.OnNext("B");

ys.OnCompleted();
xs.OnCompleted();

It produces:

result


Here's the translated javascript version:

var qs = xs.publish(
    pxs =>
      ys.buffer(() => pxs).zip(pxs, (numbers, letter) => [ letter, numbers ])
);