No tienes acceso a esta clase

隆Contin煤a aprendiendo! 脷nete y comienza a potenciar tu carrera

Operadores: map, reduce y filter

17/36
Recursos

Aportes 5

Preguntas 1

Ordenar por:

驴Quieres ver m谩s aportes, preguntas y respuestas de la comunidad?

o inicia sesi贸n.

MIS NOTAS:

Operadores pipeables

  • pipe(): todos los operadores creacionales tienen este m茅todo, genera una cadena de operadores que se pueden enlazar uno tras otro.

  • map(): itera sobre los valores que obtenemos del observable transform谩ndolos.

  • filter(): filtra los valores de un observable dada una condici贸n.

  • reduce(): combina todos los valores emitidos por un observable a trav茅s de una funci贸n acumuladora.

Es bueno comprender las cosas, y no solo utilizarlas de forma mec谩nica鈥

/* ==== OPERADORES ==== */
/* Todos los generadores de observables tienen un m茅todo llamado .pipe() que genera una especie de cadena de operadores que se pueden enlazar uno tras otro para hacer algo que queramos. */

// Operador map
const numbers1$ = from([1, 2, 3, 4, 5, 6, 7, 8]).pipe(
    map(number => number * 2),
    map(number => number ** 2)
);
numbers1$.subscribe(console.log);

// Operador reduce
const numbers2$ = from([1, 2, 3, 4, 5, 6, 7, 8]).pipe(
    reduce((acc, val) => acc + val, 0)
);
numbers2$.subscribe(console.log);

// Operador filter
const numbers3$ = from([1, 2, 3, 4, 5, 6, 7, 8]).pipe(
    filter(number => number > 6)
);
numbers3$.subscribe(console.log);

pipe: permite generar una cadena de operadores que se pueden enlazar uno tras otro
map: transforma un valor directo del observable
filter: solo emite los valores si cumple una condici贸n
reduce: combina todos los valores emitidos por el observable, usando una funci贸n acumuladora

Map, Reduce y Filter:

Estos operadores te permiten manipular y transformar flujos de datos de manera divertida y creativa.

Map

Imagina que tienes una caja de crayones de colores y quieres pintar algunas im谩genes. El operador map en RxJS es como una varita m谩gica que te permite transformar cada cray贸n en algo nuevo y emocionante.

  • Con el operador map, puedes tomar cada cray贸n y convertirlo en un color diferente o en algo completamente nuevo. Por ejemplo, puedes convertir un cray贸n rojo en un cray贸n azul, un cray贸n verde en un cray贸n amarillo, o incluso convertir un cray贸n en una varita m谩gica.
  • El operador map te permite transformar los elementos de un flujo de datos uno por uno. Puedes aplicar una funci贸n a cada elemento y obtener un nuevo elemento transformado.

Reduce

Ahora, supongamos que tienes una alcanc铆a llena de monedas y quieres saber cu谩nto dinero tienes en total. El operador reduce en RxJS es como un contador m谩gico que te ayuda a agregar todos los valores de una colecci贸n y obtener un resultado final.

  • Con el operador reduce, puedes sumar todos los valores uno por uno para obtener un total. Por ejemplo, puedes sumar el valor de cada moneda para saber cu谩nto dinero tienes en total.
  • El operador reduce te permite combinar todos los elementos de un flujo de datos en un solo resultado. Puedes aplicar una funci贸n que acumula y combina los valores para obtener un valor final.

Filter

Ahora, imagina que tienes una bolsa llena de juguetes y quieres encontrar solo los juguetes m谩s grandes y divertidos. El operador filter en RxJS es como un detector m谩gico que te ayuda a encontrar los juguetes especiales que cumplen ciertas condiciones.

  • Con el operador filter, puedes examinar cada juguete y decidir si cumple con ciertos criterios. Por ejemplo, puedes encontrar solo los juguetes de color rojo, los juguetes que hacen ruido o los juguetes que tienen forma de animal.
  • El operador filter te permite seleccionar solo los elementos de un flujo de datos que cumplen una determinada condici贸n. Puedes aplicar una funci贸n que eval煤a cada elemento y decides si debe ser incluido en el nuevo flujo de datos.

En resume:

  • El operador map transforma cada elemento en algo nuevo y emocionante.
  • El operador filter selecciona solo los elementos que cumplen ciertas condiciones.
  • El operador reduce combina todos los elementos en un solo resultado.