Understanding Lettable Operators | RxJS

lettable.js

// Using the bundle
import * as Rx from "rxjs";

const name = Rx.Observable.ajax
  .getJSON<{ name: string }>("/api/employees/alice")
  .map(employee => employee.name)
  .catch(error => Rx.Observable.of(null));

// Using prototype patching
import { Observable } from "rxjs/Observable";
import "rxjs/add/observable/dom/ajax";
import "rxjs/add/operator/catch";
import "rxjs/add/operator/map";

const name = Observable.ajax
  .getJSON<{ name: string }>("/api/employees/alice")
  .map(employee => employee.name)
  .catch(error => Observable.of(null));

// Using call
import { ajax } from "rxjs/observable/dom/ajax";
import { of } from "rxjs/observable/of";
import { _catch } from "rxjs/operator/catch";
import { map } from "rxjs/operator/map";

const source = ajax.getJSON<{ name: string }>("/api/employees/alice")
const mapped = map.call(source, employee => employee.name)
const name = _catch.call(mapped, error => of(null));

// Using lettable operators
import { ajax } from "rxjs/observable/dom/ajax";
import { of } from "rxjs/observable/of";
import { catchError, map } from "rxjs/operators";

const name = ajax
  .getJSON<{ name: string }>("/api/employees/alice")
  .pipe(
    map(employee => employee.name),
    catchError(error => of(null))
  );

sample.js

// Sometimes, when requesting resources from a HTTP API, it’s desirable to retry if an error occurs.
import * as Rx from "rxjs";

export function retry<T>(
  count: number,
  wait: number
): (source: Rx.Observable<T>) => Rx.Observable<T> {

  return (source: Rx.Observable<T>) => source
    .retryWhen(errors => errors
      // Each time an error occurs, increment the accumulator.
      // When the maximum number of retries have been attempted, throw the error.
      .scan((acc, error) => {
        if (acc >= count) { throw error; }
        return acc + 1;
      }, 0)
      // Wait the specified number of milliseconds between retries.
      .delay(wait)
    );
}

import * as Rx from "rxjs";
import { retry } from "./retry";

const name = Rx.Observable.ajax
  .getJSON<{ name: string }>("/api/employees/alice")
  .let(retry(3, 1000))
  .map(employee => employee.name)
  .catch(error => Rx.Observable.of(null));

import { ajax } from "rxjs/observable/dom/ajax";
import { of } from "rxjs/observable/of";
import { catchError, map } from "rxjs/operators";
import { retry } from "./retry";

const name = ajax
  .getJSON<{ name: string }>("/api/employees/alice")
  .pipe(
    retry(3, 1000),
    map(employee => employee.name),
    catchError(error => of(null))
  );

import { Observable } from "rxjs/Observable";
import { delay, retryWhen, scan } from "rxjs/operators";

export function retry<T>(
  count: number,
  wait: number
): (source: Observable<T>) => Observable<T> {

  return retryWhen(errors => errors.pipe(
    // Each time an error occurs, increment the accumulator.
    // When the maximum number of retries have been attempted, throw the error.
    scan((acc, error) => {
      if (acc >= count) { throw error; }
      return acc + 1;
    }, 0),
    // Wait the specified number of milliseconds between retries.
    delay(wait)
  ));
}