Bienvenidos en esta clase vamos a ver el operador TAP, que también es bastante importante, junto con
el MAP, uno de los operadores más utilizados en todo este paradigma en este mundo de programación Reactive
Stream, que es muy importante y es la base para trabajar en Angular.
Bien, pero de qué se trata este operador?
Tap tap viene de la palabra tomar, hacer algo con los valores.
Los item se van transmitiendo y podemos tomar estos valores y realizar alguna tarea, algún proceso,
pero sin modificar, sin tocar los valores en sí mismos.
Típicamente, por ejemplo, guardar algo o registrar estos datos.
Estos valores en el log o asignar a un atributo de la clase justamente lo que hace en la clase component.
Por ejemplo, el método suscribe que toma el valor que se emite de este flujo reactivo y lo asigna al
atributo clientes.
En el tap podríamos ser exactamente lo mismo.
De hecho, en el script lo podríamos dejar completamente en blanco y hacer esta operación que es asignar.
Lo podríamos ser entonces el TAP, si bien no realiza el suscrip, no suscribe un observador a nuestro
zer bable, pero si nos permite realizar algo bien.
Veamos algunos ejemplos.
Lo primero es tener que importar acá el operador igual que cualquier operador map el cache de error,
el tap se tiene que importar.
Luego en el pipe siempre dentro del pipe lo podemos utilizar.
Recuérdense para ir por comas, ya que lo importante si se fijan acá en el MAP hacemos la conversión
a clientes.
El MAP se encarga de transformar el tarnos, pero acá el tipo de dato sigue siendo del tipo object.
Si, fijate que en el map es object, en el tab también.
Por ejemplo responsos y acá podríamos ejecutar alguna tarea.
Ahora, por ejemplo, si yo quiero mostrar los datos de los clientes en el log.
Tomar el response y por ejemplo invocar el foreach.
Pero como es del tipo object, acá el foreach no existe.
Entonces lo que tenemos que hacer es previamente indicar que el response es del tipo cliente corchete.
Hacer esto, cambiar el tipo justamente como lo hicimos en el MAP no modifica los sitten del flujo.
Entonces acá en vez de response podríamos colocar clientes.
Y acá si podemos usar el forillo, el foreach tampoco toca los valores, simplemente va mostrando los
datos
y acá podemos mostrar los datos de cada cliente.
Los valores lo podemos registrar en el log.
Por ejemplo, el cliente punto nombre, si se fijan, acá estamos tomando la respuesta y se la asignamos
al área de clientes del tipo cliente corchete.
Solamente estamos creando una variable dentro del TAP como un arreglo de clientes y mostramos los datos,
pero no cambia, no modifica el flujo dato.
Si se fijan acá es el tipo object y acá también es del tipo Object.
Por lo tanto, en el TAB en ningún momento cambiamos el tipo de dato a cliente, mientras que si tuviéramos
un poco más abajo del MAP, otro tap tap ya sería del tipo corchete cliente, ya que este map se encarga
de cambiar el response del tipo Object a un tipo cliente corchete porque lo está retornando, está retornando
este cambio y además con todos los cambios de cada ítem, por ejemplo con el nombre en mayúscula.
Pero bien, vamos a copiar entonces este tap tal cual lo vamos a pegar justo debajo del map, una coma
para separar, pero bien, acá el response ya del tipo cliente, como había explicado por el MAP.
Así que esto ya no es necesario.
Simplemente podemos usar el response en vez de clientes.
Esa es la gran diferencia.
Entonces también es importante el orden en que implementemos los TAP.
Por ejemplo, el primer tap, el response del tipo Hoggett.
Luego el map cambia el respond Hoggett a un tipo cliente corchete a un tipo listado cliente y a calta
es del tipo corchete client.
Entonces, por tanto, acá siempre el orden es fundamental.
Incluso acá podríamos colocar también un mensaje en el log, como por ejemplo vamos a colocar el nombre
de la clase 2 punto tab 1.
Y acá colocamos el top 2 para diferencia.
Ahora levantamos tanto nuestro backend como nuestro frontend.
Ambas aplicaciones vamos a estar consola.
Si se fijan, aparece cliente ser vista.
Uno es el primero que se invoca y aparecen todos los nombres en minúscula, pero luego se ejecuta el
map que cambia.
La respuesta del tipo Hoggett la convierte a una lista, a un arreglo de cliente cliente corchete y
también cambia cada nombre de cada ítem, de cada objeto en mayúscula.
Y acá en el tab 2 ya se muestran los nombres convertió mayúsculas.
Entonces importante la secuencia, el orden también que le debemos en nuestro flujo rectivos.
Bien, vámonos a clientes.
Component.
A nuestro componente.
Acá en el ingi?
On init, justamente donde estamos asignando este atributo diss cliente con el valor del cliente que
viene del flujo de flujo observable.
Bien importemos el tap.
Recuerden que acá hay que agregar las llaves.
Es importante porque son operadores.
Podríamos tener más de uno
rx operato.
Ahora.
Cómo podrían implementar acá este operador en get clientes?
Este es nuestro observable.
Así que con Pipe acá podríamos tener nuestro operador y acá el suscrip como es un solo operador no es
necesario entonces ningún tipo de coma bien, este ya viene del tipo clientes corchete por el MAP.
En el map lo convertimos.
Así que acá también podríamos imprimir valores.
Por ejemplo, vamos a copiar esto.
Y lo pegamos acá.
Tengo que cambiar acá el response por clientes, quien sería el tap 3.
Que se ejecuta en la clase.
Clientes, componentes.
Entonces vamos a cambiar clientes servis por clientes compen para diferenciar y faltaría cerrar el paréntesis
del forito con su puntico.
Vamos a guardar y ahora vemos que tenemos el tab 3 dentro de clientes compone mayúscula.
Entonces el TAP nos sirve justamente para eso, trabajar con los datos para realizar algún tipo de tarea.
Ahora bien, qué pasa con el script?
El script, a pesar de que no estamos sufriendo en el observable, también podemos hacer algo similar
que era el tap.
De hecho, podríamos hacer exactamente lo mismo realizar algo sin cambiar los datos.
Es importante tener en cuenta que el operador TAP no retorna nada.
Es un point, nos retorna el item que estamos emitiendo.
Entonces por ejemplo, en el script podríamos cortar esto lo podríamos quitar y dejamos el script sin
ningún tipo de operación.
No estamos escribiendo si, pero sin hacer nada.
Y en el TAP podríamos dejar esto.
Podríamos asignar los clientes al atributo clientes y eso estaría perfecto.
También lo podríamos hacer dentro del TAP.
Lo dejamos de esa forma.
Obviamente, clientes, que sería el que estamos pasando por argumen toca en el tap, se lo asignamos
al atributo clientes y guardamos.
Vemos que el resultado es exactamente el mismo.
Ningún cambio.
Si se fijan, incluso el TAP solamente podría tener esto, lo cortamos y lo pegamos acá.
Simplemente asignar el valor, el valor clientes al atributo clientes y dejamos el shockley completamente
sin hacer nada vacío.
Lo mismo.
Ahora, qué pasa si omitimos a Sucre?
Obviamente no pasa nada, no pasa nada hasta que nos subiríamos cn el suscrip.
El observable nunca se va a ejecutar, vamos a tener nada en el navegador.
No hay ningún ítem que estemos transmitiendo, por eso es siempre fundamental e importante el suscri
ben.
Por lo tanto, usar el TAB asignando al atributo prácticamente lo mismo que esto.
Si en el TAP o ahí podríamos ir variando el script puede hacer algo, algún tipo tarea y el tap o los
tap, porque podríamos tener varios tabs dentro del ciclo día, podrían ejecutar diferentes tareas,
diferentes procesos.
Lo vamos a dejar así, pero de cualquier forma estaría bien.
Bien, eso es todo.
Quería dar un poco más de énfasis a los operadores, diferenciar un poco entre el suscrip, el tap.
Bueno, el sucre no es un operador, más bien es un método que nos permite suscribirnos dentro de flujos,
suscribir un observador.
Como decía siempre importante el Sucre y nos permite también hacer algo.
Pero el TAP no suscribe, simplemente podemos realizar algún tipo de tarea y hemos llegado a su fin
y hasta la próxima.
Nos vemos.