[RxJS] Use `lift` to Connect a `source` to a `subscriber` in RxJS

The lift method on each source hides away the internals of RxJS so you can simply connect a source to the subscriber you're working with. The lift method take an object with a call function with subscriber and source arguments, then it's up to you how you want to connect them together.

 

Previous we created a custom subscriber, we do it in subscribe() function:

import { from, Subscriber } from "rxjs";

const observable$ = from([1, 2, 3, 4, 5]);

const subscriber = {
  next: value => {
    console.log(value);
  },
  complete: () => {
    console.log("done");
  },
  error: value => {
    console.log(value);
  }
};

class DoulbeSubscriber extends Subscriber {
  _next(value) {
    this.destination.next(value * 2);
  }
}

observable$.subscribe(new DoulbeSubscriber(subscriber));

 

Of course it isn't ideal to do the transformation in subscriber.

Better way is that we can do though `pipe`, create a custom subscriber and using in the pipe:

const doulbe = source => {
  return source.lift({
    call(sub, source) {
      source.subscribe(new DoulbeSubscriber(sub));
    }
  });
};

observable$.pipe(doulbe).subscribe(subscriber);

 

We can use `lift` function which accpet an object has a call(subscriber, source).