Observable and Newsletter. A comparison.

Observables are a powerful tool in Angular and other front-end frameworks, allowing developers to easily manage and manipulate asynchronous data streams. But what many people may not realize is that observables have a lot in common with something much more mundane: newsletters.

Both are subscription-based.
Just like a newsletter, an observable is something that you subscribe to in order to receive updates. With a newsletter, you provide your email address and opt-in to receive updates on a regular basis. With an observable, you call the subscribe method and provide a callback function that will be invoked every time there is new data.

Both can be filtered and transformed.
Just as a newsletter can be filtered to only show certain types of content, observables can be transformed and filtered to only show certain types of data. RxJS, the popular library for working with observables in Angular, provides a wide range of operators that can be used to filter, transform, and manipulate data streams in all sorts of ways.

Both can be used in a variety of contexts.
Newsletters can be used to deliver all sorts of information, from news updates to promotional offers. Similarly, observables can be used to handle all sorts of asynchronous data, such as HTTP requests, user input, and real-time updates.

Here are some of the most commonly used RxJS operators in Angular:

// map operator:
import { map } from 'rxjs/operators';

source$.pipe(
    map(val => val * 2)
).subscribe(val => console.log(val));

The map operator is used to transform the data emitted by the observable. It applies a given function to each value emitted by the source observable and emits the returned value.

// filter operator:
import { filter } from 'rxjs/operators';

source$.pipe(
    filter(val => val % 2 === 0)
).subscribe(val => console.log(val));

The filter operator is used to filter the data emitted by the observable. It applies a given predicate function to each value emitted by the source observable and only emits the values that pass the predicate test.

// mergeMap operator:
import { mergeMap } from 'rxjs/operators';

source$.pipe(
    mergeMap(val => getData(val))
).subscribe(val => console.log(val));

The mergeMap operator is used to flatten multiple observables into one. It applies a given function to each value emitted by the source observable and returns an observable, the values of which are then merged into the output observable.

When working with observables in Angular, it can be helpful to consult the "Angular Decision Tree" when choosing which operator to use. This decision tree, available online, guides developers through a series of questions about the type of data and behavior they are working with and suggests the appropriate operator for the task at hand.

In conclusion, observables are an essential tool for managing asynchronous data in Angular and other front-end frameworks. Just like newsletters, they are subscription-based, can be filtered and transformed, and can be used in a variety of contexts. With the help of RxJS operators and the Angular Decision Tree, developers can easily manipulate and work with observables to build powerful and responsive applications.