¿Qué es RxJS?

La programación reactiva es un paradigma de programación asincrónica que se ocupa de los flujos de datos y la propagación del cambio : Wikipedia RxJS es una biblioteca para programación reactiva que utiliza observables que facilita la composición de código asincrónico o basado en callback -RxJS docs

Los conceptos esenciales en RxJS son

• Un observable es un flujo de datos
• Los observadores pueden registrar hasta 3 devoluciones de llamada:

1. el siguiente se llama 1: M tiempo para enviar nuevos valores al observador
2. el error se llama como máximo 1 vez cuando se produce un error
3. complete se llama como máximo 1 vez al finalizar

• La suscripción "inicia" la transmisión observable

Sin suscribirla secuencia no comenzará a emitir valores. Esto es lo que llamamos un observable frío .

Sussimilar a suscribirse a un periódico o revista ... no comenzará a obtenerlos hasta que se suscriba. Luego, crea una relación 1 a 1 entre el productor (observable) y el consumidor (observador).

¿Qué son los operadores RxJS?

Los operadores son funciones puras que permiten un estilo de programación funcional para tratar colecciones con operaciones. Hay dos tipos de operadores:

• Operadores de creación
• Operadores canalizables: transformación, filtrado, limitación de velocidad, aplanamiento

Los sujetos son un tipo especial de Observable que permite la multidifusión de valores a muchos Observadores. Mientras que los Observables simples son unicast (cada Observador suscrito posee una ejecución independiente del Observable), los Sujetos son multicast. Esto es lo que llamamos un observable caliente .

En este artículo, me centraré en las zip, combineLatesty forkJoinlos operadores. Estos son operadores de combinación RxJS, lo que significa que nos permiten unir información de múltiples observables. El orden, el tiempo y la estructura de los valores emitidos son las principales diferencias entre ellos.

Veamos cada uno individualmente.

Código Postal()

• zip no comienza a emitir hasta que cada observable interno emite al menos un valor
• zip emite siempre que los valores emitidos se puedan recopilar de todos los observables internos
• zip emite valores como una matriz

Imaginemos que estás con Mario y Luigi, dos de tus mejores amigos, en el mejor restaurante italiano de Roma. Cada uno pide una bebida, una pizza y un postre. Le especificas al camarero que primero lleve las bebidas, luego las pizzas y finalmente los postres.

Esta situación se puede representar con 3 observables diferentes, que representan los 3 órdenes diferentes. En esta situación específica, el camarero puede utilizar el zipoperador para traer (emitir) los diferentes artículos del pedido por categoría.

❗️❗️❗️Advertencia❗️❗️❗️

Si vuelves al mismo restaurante italiano con tu novia, pero ella no quiere comer, esto es lo que sucederá:

Si waiter$usa el zipoperador, ¡solo obtendrá su bebida!

¿Por qué?

Porque, cuando el waiter$emite las bebidas, lo girlfriend$observable es completo y no se le puede recolectar más valor. Con suerte, ¿ waiter$pueden usar otro operador para nosotros para no romper con nuestra novia?

combineLatest ()

• combineLatest no comienza a emitir hasta que cada observable interno emite al menos un valor
• Cuando cualquier observable interno emite un valor, emita el último valor emitido de cada

Exactamente en el mismo restaurante, los inteligentes waiter$ahora deciden utilizar el combineLatestoperador.

❗️❗️❗️Advertencia❗️❗️❗️

Con combineLatest, el orden de los observables internos proporcionados sí importa.

Si you$se proporciona primero waiter$, emitirá solo un valor ["Tiramisu", "Sprite"].

Esto sucede porque combineLatestno comienza a emitirse hasta que cada observable interno emite al menos un valor. girlfriend$comienza a emitir cuando el primer observable interno emite su último valor. Luego, combineLatestemite los últimos valores recopilados de ambos observables internos.

forkJoin ()

• forkJoinemite el último valor emitido de cada observable interno después de que todos se completan
• forkJoin nunca se emitirá si uno de los observables no se completa

Cuando vas al restaurante y pides una pizza, no quieres saber todos los pasos sobre cómo se prepara la pizza. Si se agrega el queso antes que los tomates o al contrario. ¡Solo quieres conseguir tu pizza! Aquí es donde forkJoinentra en juego.

❗️❗️❗️Advertencia❗️❗️❗️

• Si uno de los observables internos arroja un error, todos los valores se pierden
• forkJoin no completa

• Si solo le preocupa cuando todos los observables internos se completan con éxito, puede detectar el error desde el exterior
• Luego, forkJoincompleta

• Si no le importa que los observables internos se completen con éxito o no, debe detectar errores de cada uno de los observables internos
• Luego, forkJoincompleta

Personalmente, cuando voy a un restaurante con amigos, no me importa si uno de ellos recibe una pizza quemada. Solo quiero el mio por lo que le pediré al waiter$que capte los errores de los observables internos individualmente.

Envolver

¡Cubrimos mucho en este artículo! Los buenos ejemplos son importantes para comprender mejor los operadores RxJS y cómo elegirlos sabiamente.

Para los operadores de combinación como zip, combineLatesty forkJoinel orden de observables interiores que proporcionan es también crítico, ya que puede te lleva a comportamientos inesperados.

Hay mucho más que cubrir dentro de RxJS y lo haré en más artículos.

¡Espero que hayas disfrutado este artículo! ?

? ¡Puedes seguirme en Twitter para recibir notificaciones sobre nuevas publicaciones de blog de Angular / RxJS y consejos geniales!