Sobes.tech
Middle

Ce operatori pentru lucrul cu fluxurile cunoști?

sobes.tech AI

Răspuns de la AI

Operatorii pentru lucrul cu fluxurile de date, în special relevanți în contextul programării asincrone și bibliotecilor reactive (cum ar fi RxJS), pot fi împărțiți în mai multe categorii.

Operatori de creare (Creation Operators): Folosiți pentru a crea un flux nou de date.

  • of(): Creează un flux care emite un set fix de valori.
    // Din RxJS
    import { of } from 'rxjs';
    
    const source = of(1, 2, 3); // Flux care emite 1, 2, 3
    
  • from(): Transformă diverse surse de date (Promise, Iterable, ArrayLike) într-un flux.
    // Din RxJS
    import { from } from 'rxjs';
    
    const source = from([10, 20, 30]); // Flux dintr-un array
    
  • interval(): Creează un flux care emite numere consecutive după un interval de timp specificat.
    // Din RxJS
    import { interval } from 'rxjs';
    
    const source = interval(1000); // Flux care emite numere la fiecare secundă
    
  • timer(): Creează un flux care emite o singură valoare după un timp specificat, cu opțiunea de a continua cu valori ulterioare la intervale.
  • fromEvent(): Creează un flux din evenimente DOM sau EventEmitter.

Operatori de transformare (Transformation Operators): Modifică valorile emise de flux.

  • map(): Transformă fiecare valoare emitând rezultatul funcției aplicate.
    // Din 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 cu valori 2, 4, 6
    
  • pluck(): Extrage o proprietate din fiecare obiect emis.
  • scan(): Aplică o funcție de acumulare și emite rezultatele intermediare.
  • mergeMap() / flatMap(): Proiectează fiecare valoare într-un nou flux și le combină. Permite operații asincrone.
    // Din 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'))); // Valori '1a', '1b', '2a', '2b'
    
  • switchMap(): Similar cu mergeMap, dar anulează fluxul intern anterior când apare o nouă valoare.
  • concatMap(): Asigură că fluxurile interne sunt executate secvențial.

Operatori de filtrare (Filtering Operators): Permite trecerea valorilor selectate.

  • filter(): Permite doar valorile care îndeplinesc o condiție.
    // Din 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)); // 2, 4
    
  • take(): Permite doar primele N valori.
  • takeUntil(): Permite valorile până când un alt flux emite o valoare.
  • skip(): Sare peste primele N valori.
  • debounceTime(): Emite valoarea după o perioadă de timp fără alte emisii.
  • distinctUntilChanged(): Emite valoarea doar dacă diferă de cea anterioară.

Operatori de combinare (Combination Operators): Combină mai multe fluxuri într-unul singur.

  • combineLatest(): Emite cele mai recente valori din toate fluxurile la fiecare schimbare.
  • zip(): Combină valorile din fluxuri pe baza indexului.
  • merge(): Combină fluxurile și le emite valorile pe măsură ce apar.
  • concat(): Le execută secvențial.

Operatori de gestionare a erorilor (Error Handling Operators): Gestionează erorile.

  • catchError(): Capturează eroarea și poate continua fluxul sau îl poate înlocui.
    // Din RxJS
    import { throwError } from 'rxjs';
    import { catchError, of } from 'rxjs/operators';
    
    const source = throwError(() => new Error('Ceva nu a mers bine'));
    const result = source.pipe(catchError(err => of('Eroare capturată'))); // Flux cu valoarea 'Eroare capturată'
    
  • retry(): Reîncearcă abonarea N ori în caz de eroare.

Operatori de finalizare (Completion Operators): Definește comportamentul la finalizarea fluxului.

  • finalize(): Execută o acțiune la finalizare sau anulare.
  • tap(): Permite efecte secundare fără a modifica valorile.

Aceasta nu este o listă completă, ci o selecție importantă de operatori cu care se lucrează frecvent în dezvoltarea frontend, mai ales în abordarea reactivă.