Reactive Programming with RxJS 5

What’s Reactive?

Let’s start by looking at a little program. This program retrieves data from different sources with the click of a button. It has the following requirements:

• It must unify data from two different locations that use different JSON structures.

• The final result should not contain any duplicates.

• The user should not be able to click the button more than once every second, to avoid requesting data too many times.

Using RxJS, we would write something like this:

import { Observable } from "rxjs";

const button = document.getElementById("retrieveDataBtn");
const source1 = Observable.ajax.getJSON("/resource1").pluck("name");
const source2 = Observable.ajax.getJSON("/resource2").pluck("props", "name" ...