What operators do you know for working with streams…

Operators for working with data streams, especially relevant in the context of asynchronous programming and reactive libraries (like RxJS), can be divided into several categories.

Creation Operators: Used to create a new data stream.

of(): Creates a stream that emits a fixed set of values.

// From RxJS
import { of } from 'rxjs';

const source = of(1, 2, 3); // Stream emitting 1, 2, 3

from(): Converts various data sources (Promise, Iterable, ArrayLike) into a stream.

// From RxJS
import { from } from 'rxjs';

const source = from([10, 20, 30]); // Stream from array

interval(): Creates a stream that emits sequential numbers at a specified interval.

// From RxJS
import { interval } from 'rxjs';

const source = interval(1000); // Stream emitting numbers every second

timer(): Creates a stream that emits a single value after a specified time, optionally with subsequent values at intervals.
fromEvent(): Creates a stream from DOM events or EventEmitter.

Transformation Operators: Change the values emitted by the stream.

map(): Transforms each value emitted by the stream by applying a given function.

// From RxJS
import { of } from 'rxjs';
import { map } from 'rxjs/operators';

const source = of(1, 2, 3);
const result = source.pipe(map(x => x * 2)); // Stream with values 2, 4, 6

pluck(): Extracts a property from each object emitted by the stream.
scan(): Applies an accumulator function to each value in the stream and emits intermediate results.

mergeMap() / flatMap(): Projects each value of the source stream into a new stream (Inner Observable) and flattens them into a single output stream. Allows performing asynchronous operations for each value.

// From RxJS
import { of } from 'rxjs';
import { mergeMap } from 'rxjs/operators';

const source = of(1, 2);
const result = source.pipe(mergeMap(val => of(val + 'a', val + 'b'))); // Stream with values '1a', '1b', '2a', '2b'

switchMap(): Similar to mergeMap, but cancels the previous inner stream when a new value is emitted from the source. Useful for autocomplete or cancelable requests.
concatMap(): Similar to mergeMap, but guarantees that inner streams are executed sequentially in the order they were created.

Filtering Operators: Selectively pass through values emitted by the stream.

filter(): Passes values only if they satisfy a given condition.

// From RxJS
import { of } from 'rxjs';
import { filter } from 'rxjs/operators';

const source = of(1, 2, 3, 4);
const result = source.pipe(filter(x => x % 2 === 0)); // Stream with values 2, 4

take(): Passes only the first N values from the stream.
takeUntil(): Passes values from the stream until another stream emits a value (stop signal).
skip(): Skips the first N values from the stream.
debounceTime(): Emits a value only after the stream has stopped emitting for a specified duration. Useful for preventing too frequent actions (e.g., input in a search field).
distinctUntilChanged(): Emits a value only if it differs from the previously emitted value.

Combination Operators: Combine multiple streams into one.

combineLatest(): Combines values from multiple streams, emitting an array of the latest values from each stream whenever any input stream changes.
zip(): Combines values from multiple streams, emitting an array of values by index (first from first, first from second, etc.).
merge(): Merges multiple streams, emitting values from them as they arrive.
concat(): Concatenates multiple streams, executing them sequentially (first until completion, then the next, etc.).

Error Handling Operators: Define behavior in case of errors in the stream.

catchError(): Catches an error in the stream and allows continuing the stream or replacing it with another stream.

// From RxJS
import { throwError } from 'rxjs';
import { catchError, of } from 'rxjs/operators';

const source = throwError(() => new Error('Something went wrong'));
const result = source.pipe(catchError(err => of('Error caught'))); // Stream with value 'Error caught'

retry(): Attempts to resubscribe to the stream N times upon an error.

Completion Operators: Define behavior upon stream completion.

finalize(): Executes a specified action upon completion (successful or with error) or unsubscription.
tap(): Allows performing side effects (e.g., logging) without modifying the stream's values.

This is not an exhaustive list, but it covers the most important operators often used in frontend development, especially when adopting a reactive approach.

What operators do you know for working with streams?