Reactive Programming is a declarative programming paradigm focused on asynchronous data streams and the propagation of change, enabling developers to work with time-varying values and event sequences. It treats everything as a stream of data that can be observed, transformed, and combined using composable operators. This approach is essential for building responsive, resilient systems that handle high concurrency, real-time updates, and complex asynchronous workflows—from modern web applications and microservices to streaming data pipelines and IoT systems. Key to mastering reactive programming is understanding that data flows through pipelines where each operator transforms emissions without side effects, and managing subscriptions properly is critical to avoid memory leaks.
What This Cheat Sheet Covers
This topic spans 15 focused tables and 118 indexed concepts, 108 flashcards. Below is a complete table-by-table outline of this topic, spanning foundational concepts through advanced details.
A jump-to index of every table row in this cheat sheet.
An interactive map of every table and concept in this topic.
Table 1: Core Concepts
Everything in reactive programming traces back to a small set of building blocks—the Observable that pushes values, the Observer that consumes them, and the Subscription that ties the two together and must be torn down to free resources. The Subject variants and the hot/cold distinction round out the vocabulary you need before any operator makes sense.
| Concept | Example | Description | |
|---|---|---|---|
interval(1000).pipe( map(x => x * 2)) | • Lazy push-based collection representing asynchronous data stream • emits zero or more values over time, then completes or errors | ||
obs.subscribe({ next: x => console.log(x), error: e => console.error(e), complete: () => console.log('Done')}) | • Consumer that listens to Observable • defines next, error, and complete callbacks to receive notifications | ||
const sub = obs.subscribe(x => {...});sub.unsubscribe(); | • Represents ongoing execution of Observable • calling unsubscribe() stops emission and frees resources to prevent memory leaks | ||
const subject = new Subject();subject.next(1);subject.subscribe(x => {...}); | • Acts as both Observable and Observer • multicasts to multiple subscribers simultaneously | ||
const bsub = new BehaviorSubject(0);bsub.subscribe(x => {...});bsub.next(5); | • Subject that stores current value • immediately emits latest value to new subscribers | ||
const rsub = new ReplaySubject(3);rsub.next(1); rsub.next(2);rsub.subscribe(x => {...}); | • Subject that buffers specified number of past emissions • replays them to new subscribers | ||
const async = new AsyncSubject();async.next(1); async.next(2);async.complete(); | Subject that emits only the last value when the sequence completes. | ||
const click$ = fromEvent(button, 'click'); | • Emits data independently of subscriptions • multiple subscribers share the same execution and receive emissions from subscription point forward | ||
const http$ = ajax.get('/api/data'); | • Creates new producer for each subscriber • each subscription triggers independent execution from the beginning | ||
of(1, 2, 3).pipe( map(x => x * 10), filter(x => x > 15)) | • Pure function that takes Observable input and returns new transformed Observable • enables declarative composition through pipe(). |