Async

So far, all of our functional programming has been applied to values that were immediately available to us.

This style of functional programming is synchronous and eager.

// We can map over the values in a right away
const a = [1, 2, 3];
const b = a.map(v => v * 2);

How do we apply functional principles and techniques to asynchronous programming?

Map Lazy & Lazy Array

Imagine you could have a mapLazy function that allowed you to asynchronously map over values in an array as new values were added in.

const a = [];
const b = mapLazy(a, v => v * 2);

a.push(1);
a[0]; // 1
b[0]; // 2

a.push(3);
a[1]; // 3
b[1]; // 6

What's more: what if you could define a LazyArray data structure? It would almost be like you're creating event listeners as you add/remove values from the lazy array.

const a = new LazyArray();

setInterval(() => a.push(Math.random()), 1000);

const b = a.map(v => v * 2);

// forEach would be like an event listener that would trigger
// every time a value was added to a and then propagated to b
b.forEach(console.log);

Importance: If a LazyArray existed, since we know we can apply functional techniques to regular arrays, we could in theory apply them to these lazy arrays as well!

Observables

Although lazy arrays don't actually exist, observables are conceptually the same thing.

An observable involves an asynchronous flow of data. Think of like a spreadsheet: you have cell A1 with a value and cell B5 with the formula =A1 * 2. If you change A1, B5 changes at the same time because B5 is mapped to A1.

Note: Observables fall under the area of reactive programming.

Reactive Programming with Rx.js

Rx.js stands for reactive extensions. Here's how you'd listen for changes to an observable. It's practically identical to our fictitious example above:

const a = new Rx.Subject();

setInterval(() => a.next(Math.random()), 1000);

const b = a.map(v => v * 2);

b.subscribe(console.log);

Note: When you call any method like map or filter or reduce in an observable, it returns another observable. That's how we're able to subscribe to the changes to the observable.