Vamos a ver una pequeña introducción a los observables que parte del Happy reactive streams de JavaScript
que también se le conoce como RX 10.
Es una librería en JavaScript que nos permite implementar programación reactiva en Angular.
Bueno, se integra y es para traja con datos con flujos que puede que vengan no de forma inmediata.
Puede tener un deleite algún tiempo de espera.
En fin.
Entonces la idea trabajar con eventos, suscribirnos y estar pendiente escuchando cuando se emitan estos
datos de flujo.
Este streams.
Entonces cuando se emite hay tema que implementar.
Un código que se le conoce como un observador o centinela, que es un fragmento de código que está pendiente
escuchando y se encarga de ejecutar algo.
Realizar un proceso.
Cuando se reciben los datos.
Cuando llegan, entonces el observable es el evento.
El observador es el centinela.
Nuestro código que maneja estos datos, que lo recibe el observable, emite estos datos.
Entonces, para resumir un observador, nuestro código reacciona a cualquier elemento de este flujo
o secuencia de elementos que se esté metiendo en este observable.
Y tenemos que suscribirnos.
Pero bien, veamos las características de los observables.
Primero es asíncrono, nos sirve para trabajar tareas que son asíncronas.
Bueno, lo típico.
Peticiones http consumo de api rest a un piquín, por ejemplo.
Y esto podría tener un deeley.
Podría tardar.
Entonces, por eso lo manejamos de esta forma, de forma reactiva, con una suscripción y con un observador
que básicamente es nuestro código.
Ese es el escenario típico.
Pero bueno, no necesariamente tiene que ser así.
También podemos implementar estos observable para cualquier trabajo o tarea que queramos ejecutar y
esperar una respuesta que no viene de forma inmediata.
Es decir, que puede tener algún delay.
O bien, por ejemplo, si en otra parte de nuestro código, de nuestra aplicación, en otro componente
se realiza un cambio, en otros datos se gatilla un evento.
Bueno, también podemos suscribirnos a este evento, a este observable y cuando se dispare, cuando
lo recibamos ahí, manejar alguna tarea con este nuevo dato, con este nuevo cambio que se acaba de
ejecutar.
Entonces no solamente es para Pierrette, sino que también lo podemos utilizar dentro de nuestra aplicación
para manejar cambios, para estar pendiente a estos cambios en nuestro código y ser notificado cuando
algo suceda.
Bueno, ejemplos hay muchos contadores, intervalos de tiempo.
Bueno, un ejemplo típico cuando utilizamos Event Matter de Angular, podemos crear un observable a
través de un evento.
Evento que se dispara en otro componente y en otra parte de nuestra aplicación podemos estar pendiente
a este cambio.
Otra característica flujo de datos o stream.
Cuando nos suscribimos podríamos estar escuchando o esperar que se emita una gran cantidad elementos,
una secuencia o bien un solo dato que se emite finalmente como una corriente.
También un ejemplo o una alegoría.
Podría ser un típico proceso de fábrica donde tenemos una correa transportadora con varios productos.
Bueno, cada uno tu producto es un item de algo y se puede manejar como un stream y tenemos distintas
estaciones de trabajo que recibimos estos productos y lo empaquetamos.
Realizamos una tarea con este producto en otra estación de trabajo, le ensamblamos otra cosa y a fin
otra característica que son concurrentes.
Por tanto, no bloquean otro proceso.
Por lo tanto cada observable se ejecuta en su propio proceso y no interfiere no lo a los demás.
Recordemos que cuando nos suscribimos a estos cereales que se emiten los datos, tenemos un centinela,
un observador y el observador se encarga de reaccionar a cualquier elemento que se vaya emitiendo en
este observable, y esa tarea se ejecuta en un proceso distinto al resto.
Por lo tanto es concurrente, maneja concurrencia, no urquía las tareas.
En otras palabras, no bloquea nuestra aplicación o nuestro componente o demás observable que se están
ejecutando.
Pues Troi pendiente escuchando atento pero en un proceso separado no interrumpe el resto.
Un observable no se ejecuta.
No pasa nada si no nos suscribimos.
Es decir, podríamos invocar un observable.
Pero mientras no invoquemos el método subscribe, mientras no implementemos nuestro código, nuestro
observador o centinela, bueno, simplemente no hace nada.
Entonces por eso muy importante siempre el método suscribe suscribirse a este flujo reactivo a este
observable.
Acá en el ejemplo tenemos varios elementos, cuatro elementos que se están emitiendo.
Esto sucede cuando nos suscribimos, cuando no sufrimos, recién se comienzan a emitir estos elementos.
Pero también podemos aplicar operadores en nuestro flujo, en nuestros datos, por ejemplo, realizar
algún cambio, modificar el flujo.
Por ejemplo, se están emitiendo círculos, varios círculos.
Obtenemos cada círculo y mediante el operador map pueden convertir este círculo a un stream de rombos.
Perdón Pentagono y esto se aplica también a los objetos.
Es decir, podríamos tener un stream, por ejemplo del tipo string, un string por ejemplo, con nombre
y podríamos convertir esto en otro tipo dato.
Por ejemplo, en objetos del tipo usuario ya con un tipo más específico.
Entonces podemos convertir.
Ya sea de tipo dato.
O bien podemos tomar un objeto y le podemos asignar valores, realizar cálculos, guardar información
extra en atributos o modificar atributos.
EFFI Pero así como tenemos el MAP para convertir datos, también tenemos muchos operadores.
Por ejemplo, el filter para filtrar, por ejemplo.
Acá quiero filtrar solamente lo pentágonos pero de color naranja.
Recordemos que convertimos los círculo en pentágonos.
Yo requiero filtrar solamente aquellos que sean de color naranja y el resto lo omitimos.
En el flujo se modifica el flujo, pero filtrando los datos y así tenemos un montón de operadores.
Por ejemplo, el retri que para intentar por ejemplo ocurre un error en nuestra comunicación o en el
flujo y quiero volver a intentar ejecutar estos cerval.
Pero también podría ser un error de comunicación de delay que está bien.
El rey otroy lo podríamos resolver, pero también podría ser un error mucho más complicado.
Un error 500 en nuestra aplicación en nuestro Aiken, que puede ser a nivel de código o lo que sea.
No nota levantada.
En fin.
Entonces vamos a estar intentando una y otra vez.
Podríamos tener un límite, por ejemplo, que intente hasta cinco veces.
Por ejemplo, también tenemos otro operadores que son muchos para trabajar con intervalo de tiempo,
con cálculo matemático.
Por ejemplo, si se emiten números, calcular el máximo, el mínimo, el count para contar, el zum
para sumar.
Bueno, siempre cuando se trata de numéricos un flujo con tipo numérico, pero también puedo concatenar,
es decir, combinar dos flujos.
También podemos repetir dos o varias veces el mismo flujo.
En fin, hay muchas operadores que podemos trabajar para manejo de error también.
Por ejemplo, el catch error.
Justamente manejo, error y reintentar.
Bueno, con el catch error puedo manejar los errores, podemos hacer algo, por ejemplo, ocurre algo,
capturamos esta sección y lo manejamos en vez de que se interrumpa este componente que se comunica con
un observable.
Podríamos dar un mensaje al usuario, un mensaje de advertencia o de alerta y que ese componente continúe
con la ejecución normal.
Solamente muestro mensaje de error al usuario, pero todo lo demás puede seguir funcionando sin ningún
problema.
Y acá es cuando podemos aplicar, por ejemplo, el retrate reintentar.
Entonces ocurre el error y podemos volver a intentar o insistir en ejecutar este observable bien.
Y también pueden ser infinitos.
Bueno, lo típico es que hagan finito comunicara con el Wacken.
El Wacken nos retorna, por ejemplo, un listado de algo o el detalle de algo.
Bueno, cuando se resuelve todo retorna a la lista y se completa el observable e termina el proceso.
Está molesto, pero también podría ser infinito.
Nos podríamos suscribir a un evento que esté emitiendo mensaje de alerta de forma indeterminada y así
como traja en la mayoría de las redes sociales Instagram, Facebook.
Cada vez que alguien publica algo bueno, nosotros estamos recibiendo notificaciones y eso es siempre,
siempre.
La aplicación está escuchando notificaciones del usuario y la vamos recibiendo, pero muchas veces y
la gran mayoría son finitos, es decir, un proceso que realiza alguna tarea, se emite algún dato o
una secuencia y finaliza, se completa y ahí se invoca por debajo.
El método complet del observable y finaliza todo, todo correctamente.
Otra característica súper importante de los observable que se pueden cancelar en cualquier momento invocando
el método aun suscribe y finaliza.
El observable no se sigue ejecutando y tal vez son inmutable.
Cada observable, cada flujo es inmutable en sí mismo.
Esto quiere decir que cree que modificamos el flujo con un operador.
Lo que hace es no modificar el flujo original.
El flujo original no cambia lo que hace retornar un nuevo flujo, un nuevo observable con los nuevos
datos, con los datos modificados, ya sea con el MAPP, con el filter, con el con Catt, en fin,
con cualquier operador que modifique los datos.
Siempre retorna un nuevo observable con estos cambios y el anterior se mantiene tal cual.
Siempre podemos volver a los datos originales y esto sería la catalítica más importante.
Y continuamos la siguiente clase.