Operadores de distinción

Clase 19 de 36 • Curso de Programación Reactiva con RxJS

Contenido del curso

Fundamentos de programación reactiva

Introducción a la librería RxJS

Generación de Observables

Transformación con Operadores

Manejo de errores

29
Manejo de errores en RxJS
07:44 min

Peticiones HTTP con RxJS

Recomendaciones y conclusión

Bonus

35
Implementación de PlatziBoard en React
02:03 min

Despedida

36
Próximos pasos con RxJS
01:07 min

Tomar examen

Comentarios

Víctor Andrés Córdova Poma

student•

Según la documentación no solo se puede trabajar con objetos con el operador distinctUntilKeyChanged. Por ejemplo: Con distinc

const people = [
	{name: "victor", age: 10},
	{name: "andres", age: 5},![ejemplo_distinc.PNG](https://static.platzi.com/media/user_upload/ejemplo_distinc-de7ae75a-5fc1-4742-9353-804c3f45b023.jpg)
	{name: "andres", age: 3},
	{name: "alex", age: 5},
	{name: "victor", age: 7},
	{name: "alex", age: 5}
]
const peopleFilteredByAge$ = scheduled(people, asyncScheduler).pipe(
	distinct(({age}) => age)
)

peopleFilteredByAge$.subscribe(console.log);

Resultados:

Víctor Andrés Córdova Poma

student•

Hay más ejemplos dentro de la documentación. Posdata: En este ejemplo hice uso de scheduled en vez de from u of, porque, según la documentación, serán removidos.

Platzi Team

student•

Imagina que tienes una colección de juguetes en tu habitación, pero algunos de ellos son iguales. Los operadores de distinción en RxJS te ayudan a encontrar los juguetes únicos y especiales en esa colección El operador distinct te permite encontrar los juguetes únicos en tu colección. Funciona como un detector mágico de juguetes especiales, donde solo se permite un juguete de cada tipo.

Operador distinct

Con el operador distinct, puedes asegurarte de que no haya juguetes repetidos en tu colección. Si encuentras dos juguetes iguales, el operador distinct solo mostrará uno de ellos.
Con el operador distinct, puedes asegurarte de que no haya juguetes repetidos en tu colección. Si encuentras dos juguetes iguales, el operador distinct solo mostrará uno de ellos.

Operador distinctUntilChanged:

El operador distinctUntilChanged te ayuda a encontrar los juguetes únicos que son diferentes de los anteriores. Imagina que estás mostrando tus juguetes a tus amigos y no quieres repetir el mismo juguete dos veces seguidas.
Con el operador distinctUntilChanged, puedes asegurarte de mostrar solo los juguetes que son diferentes del juguete anterior. Si muestras el mismo juguete varias veces seguidas, el operador distinctUntilChanged solo mostrará el primer juguete y luego ignorará los repetidos.

Operador distinctUntilKeyChanged:

Con el operador distinctUntilKeyChanged, puedes asegurarte de que solo se muestren los juguetes que tienen un valor único para la propiedad seleccionada (en este caso, el color). Si un juguete tiene el mismo valor de color que el juguete anterior, se considerará repetido y se omitirá.

En resume:

El operador distinct te ayuda a encontrar los juguetes únicos en tu colección, sin repeticiones.

El operador distinctUntilChanged te ayuda a encontrar los juguetes únicos que son diferentes de los anteriores, evitando repeticiones seguidas.

El operador distinctUntilKeyChanged te permite encontrar elementos únicos en un flujo de datos en función de una clave (propiedad) específica.

const people = [
	{name: "victor", age: 10},
	{name: "andres", age: 5},![ejemplo_distinc.PNG](https://static.platzi.com/media/user_upload/ejemplo_distinc-de7ae75a-5fc1-4742-9353-804c3f45b023.jpg)
	{name: "andres", age: 3},
	{name: "alex", age: 5},
	{name: "victor", age: 7},
	{name: "alex", age: 5}
]
const peopleFilteredByAge$ = scheduled(people, asyncScheduler).pipe(
	distinct(({age}) => age)
)

peopleFilteredByAge$.subscribe(console.log);

Operadores de distinción

Fundamentos de programación reactiva

¿Por qué deberías aprender programación reactiva con RxJS?

La teoría de la programación reactiva

Introducción a la librería RxJS

Extensiones Reactivas

La idea de la reactividad

Diagrama de canicas

Generación de Observables

Creación de un Observable

Introducción al Proyecto PlatziWordle

Observables: fromEvent

Aplicación de fromEvent en PlatziWordle

Observables: Subject

Aplicación de Subject en PlatziWordle

Observables: from y of

Observables: interval y time

Finalización del Proyecto PlatziWordle

Transformación con Operadores

Introducción al Proyecto PlatziBoard

La idea de un Operador

Operadores: map, reduce y filter

Aplicación de map en PlatziBoard