Tag Archives: reactivex

Reactive Programming

What is Reactive Programming?

Reactive programming is programming paradigm that works with asynchronous data streams.

Data streams can be created from many things such as:

  • UI Events
  • Http Requests
  • File Systems
  • Array-like objects
  • Memory/Cache

Stream

A sequence of ongoing events ordered in time.

Stream emits a value, error and complete signal.

So we can get the data it emits (any type of data) or we can get errors if something goes wrong

or we can get a signal that notifies when it gets complete.

The image below represents a stream.

reactive programming

Observables:

  • Observables are used to watch these streams and emit functions when a value, error or completed signal is returned.
  • Observables can be subscribed to by an observer.
  • Observables will constantly watch streams and will updated accordingly.
  • We can interact with data streams as any regular array.

Simple examples for creating observable

// From one or multiple values
 Rx.Observable.of('foo', 'bar');

// From array of values
 Rx.Observable.from([1,2,3]);

// From an event
 Rx.Observable.fromEvent(document.querySelector('button'), 'click');

// From a Promise
 Rx.Observable.fromPromise(fetch('/users'));

// From a callback (last argument is a callback)
 // fs.exists = (path, cb(exists))
 var exists = Rx.Observable.bindCallback(fs.exists);
 exists('file.txt').subscribe(exists => console.log('Does file exist?', exists));

Now, we cannot use standard JavaScript ES5 or ES6 to work with Observables and Streams and Reactive Extensions or ReactiveX is what allows us to do that.

Reactive Extension/ReactiveX

  • A library for composing asynchronous programs by using observable sequences.
  • Provides a long list of operators which allow us to filter, select, combine, and compose observables.

Other Implementations of the Reactive Extensions: