Quels opérateurs pour travailler avec des flux…

Les opérateurs pour travailler avec des flux de données, particulièrement pertinents dans le contexte de la programmation asynchrone et des bibliothèques réactives (comme RxJS), peuvent être classés en plusieurs catégories.

Opérateurs de création (Creation Operators): Utilisés pour créer un nouveau flux de données.

of(): Crée un flux qui émet un ensemble fixe de valeurs.

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

const source = of(1, 2, 3); // Flux émettant 1, 2, 3

from(): Convertit diverses sources de données (Promise, Iterable, ArrayLike) en flux.

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

const source = from([10, 20, 30]); // Flux à partir d'un tableau

interval(): Crée un flux qui émet des nombres séquentiels à intervalles réguliers.

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

const source = interval(1000); // Flux émettant des nombres chaque seconde

timer(): Crée un flux qui émet une valeur après un délai défini, éventuellement avec des valeurs suivantes à intervalles.
fromEvent(): Crée un flux à partir d'événements DOM ou EventEmitter.

Opérateurs de transformation (Transformation Operators): Modifient les valeurs émises par le flux.

map(): Transforme chaque valeur émise en lui appliquant une fonction.

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

const source = of(1, 2, 3);
const result = source.pipe(map(x => x * 2)); // Flux avec valeurs 2, 4, 6

pluck(): Extrait une propriété de chaque objet émis.
scan(): Applique une fonction d'accumulation à chaque valeur du flux et émet les résultats intermédiaires.

mergeMap() / flatMap(): Projette chaque valeur du flux original dans un nouveau flux (Observable interne) et les combine en un seul flux de sortie. Permet d'effectuer des opérations asynchrones pour chaque valeur.

// De 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'))); // Flux avec valeurs '1a', '1b', '2a', '2b'

switchMap(): Semblable à mergeMap, mais en émettant une nouvelle valeur, annule l'abonnement au flux interne précédent. Utile pour l'autocomplétion ou les requêtes avec annulation.
concatMap(): Semblable à mergeMap, mais garantit que les flux internes s'exécutent dans l'ordre.

Opérateurs de filtrage (Filtering Operators): Permettent de passer sélectivement les valeurs émises.

filter(): Ne laisse passer que les valeurs qui satisfont une condition.

// De 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)); // Flux avec valeurs 2, 4

take(): Ne prend que les N premières valeurs.
takeUntil(): Prend des valeurs jusqu'à ce qu'un autre flux émette.
skip(): Ignore les N premières valeurs.
debounceTime(): N'émet une valeur qu'après que le flux est resté inactif pendant un certain temps. Utile pour éviter des actions trop fréquentes.
distinctUntilChanged(): N'émet une valeur que si elle diffère de la précédente.

Opérateurs de combinaison (Combination Operators): Combinent plusieurs flux en un seul.

combineLatest(): Combine les dernières valeurs de plusieurs flux, émettant un tableau avec ces dernières valeurs à chaque changement.
zip(): Combine les valeurs de plusieurs flux en un tableau par index.
merge(): Fusionne plusieurs flux, émettant leurs valeurs dès qu'elles arrivent.
concat(): Exécute plusieurs flux en séquence.

Opérateurs de gestion des erreurs (Error Handling Operators): Définissent le comportement en cas d'erreur.

catchError(): Capture une erreur et permet de continuer ou de remplacer le flux.

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

const source = throwError(() => new Error('Quelque chose a mal tourné'));
const result = source.pipe(catchError(err => of('Erreur capturée'))); // Flux avec la valeur 'Erreur capturée'

retry(): Réessaie la souscription N fois en cas d'erreur.

Opérateurs de terminaison (Completion Operators): Définissent les actions à la fin du flux.

finalize(): Exécute une action à la fin ou lors d'une annulation.
tap(): Permet des effets secondaires sans modifier les valeurs.

Ce n'est pas une liste exhaustive, mais elle couvre les opérateurs les plus importants fréquemment utilisés en développement frontend, notamment avec la programmation réactive.

Quels opérateurs pour travailler avec des flux connaissez-vous?