¿Qué operadores para trabajar con flujos conoces?

Los operadores para trabajar con flujos de datos, especialmente relevantes en el contexto de la programación asíncrona y bibliotecas reactivas (como RxJS), se pueden dividir en varias categorías.

Operadores de creación (Creation Operators): Se utilizan para crear un nuevo flujo de datos.

• of(): Crea un flujo que emite un conjunto fijo de valores.

  // De RxJS
  import { of } from 'rxjs';
  
  const source = of(1, 2, 3); // Flujo que emite 1, 2, 3
  

• from(): Convierte diversas fuentes de datos (Promise, Iterable, ArrayLike) en un flujo.

  // De RxJS
  import { from } from 'rxjs';
  
  const source = from([10, 20, 30]); // Flujo desde un array
  

• interval(): Crea un flujo que emite números secuenciales a intervalos de tiempo definidos.

  // De RxJS
  import { interval } from 'rxjs';
  
  const source = interval(1000); // Flujo que emite números cada segundo
  

• timer(): Crea un flujo que emite un valor después de un tiempo definido, opcionalmente con valores posteriores a intervalos.
• fromEvent(): Crea un flujo a partir de eventos DOM o EventEmitter.

Operadores de transformación (Transformation Operators): Modifican los valores emitidos por el flujo.

• map(): Transforma cada valor emitido por el flujo aplicándole una función.

  // 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)); // Flujo con valores 2, 4, 6
  

• pluck(): Extrae una propiedad de cada objeto emitido por el flujo.
• scan(): Aplica una función acumuladora a cada valor del flujo y emite los resultados intermedios.
• mergeMap() / flatMap(): Proyecta cada valor del flujo original en un nuevo flujo (Observable interno) y los combina en un solo flujo de salida. Permite realizar operaciones asíncronas para cada valor.

  // 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'))); // Flujo con valores '1a', '1b', '2a', '2b'
  

• switchMap(): Similar a mergeMap, pero al emitir un nuevo valor, cancela la suscripción al flujo interno anterior. Útil para autocompletado o solicitudes con cancelación.
• concatMap(): Similar a mergeMap, pero garantiza que los flujos internos se ejecuten en orden.

Operadores de filtrado (Filtering Operators): Permiten pasar selectivamente valores emitidos por el flujo.

• filter(): Solo pasa valores que cumplen una condición.

  // 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)); // Flujo con valores 2, 4
  

• take(): Solo toma los primeros N valores.
• takeUntil(): Toma valores hasta que otro flujo emite un valor.
• skip(): Omite los primeros N valores.
• debounceTime(): Emite un valor solo después de que el flujo ha estado inactivo durante un tiempo definido. Útil para evitar acciones demasiado frecuentes.
• distinctUntilChanged(): Emite un valor solo si es diferente del anterior.

Operadores de combinación (Combination Operators): Combinan varios flujos en uno.

• combineLatest(): Combina los últimos valores de varios flujos, emitiendo un array con los últimos valores de cada uno cuando uno de ellos cambia.
• zip(): Combina valores de varios flujos en un array por índice.
• merge(): Combina varios flujos, emitiendo sus valores a medida que llegan.
• concat(): Ejecuta varios flujos en secuencia.

Operadores de manejo de errores (Error Handling Operators): Definen el comportamiento ante errores.

• catchError(): Captura errores y permite continuar o reemplazar el flujo.

  // De RxJS
  import { throwError } from 'rxjs';
  import { catchError, of } from 'rxjs/operators';
  
  const source = throwError(() => new Error('Algo salió mal'));
  const result = source.pipe(catchError(err => of('Error capturado'))); // Flujo con valor 'Error capturado'
  

• retry(): Reintenta la suscripción N veces ante error.

Operadores de finalización (Completion Operators): Definen acciones al terminar el flujo.

• finalize(): Ejecuta una acción al finalizar o cancelar.
• tap(): Permite efectos secundarios sin modificar los valores.

Esta no es una lista exhaustiva, pero cubre los operadores más importantes con los que se trabaja frecuentemente en desarrollo frontend, especialmente con programación reactiva.