Observable vs. Promesa

Estuvo buena la clase, pero sinceramente por favor considerar hacer un curso de RXJS y sus operadores (al menos los mas utilizados), no es algo que se pueda ver y practicar con 1 o 2 clases, debiese ser un curso dentro del roadmap de la escuela. Recordemos que tener conocimientos sobre los operadores RXJS nos da un poder bastante grande en el desarrollo con Angular

Me asombra el conocimiento que tiene Nicolás, me gustaría saber un poco de su historia de como aprendió y aprende tan minuciosamente todo este tema, pues sería un ejemplo a seguir. Gracias por la explicación.
Soy un observable de este curso, ja ja ja.

Deberia existir un curso de rxjs orientado a angular

Magistral clase!!
Muchas gracias Nicolas por esta explicación 👍👍.

Observables:

• Omitir / responder varias respuestas
• Transmisión de muchos datos
• Permite hacer transformaciones de datos y cancelar la subscripción
• Permite transformar la respuesta (pipes)
• Es posible escuchar constantemente : eventos / responsive / fetchs

Promesa :

• Retorna una única respuesta
• Solo se ejecuta una vez
• Simplicidad

#HaganCursoDeRXJS

Estaba con muchas dudas acerca de qué tan parecida era una promesa y un observable, y esta clase me ha ayudado un montón.

recomiendo mucho esta clase de otro curso aqui en platzi para entender mejor los observables y su patron de diseño

https://platzi.com/clases/1642-javascript-profesional/22188-implementacion-del-patron-observer/

Excelente curso @nicobytes, sobretodo por que te motiva entender lo que explican en el video mediante “el apartado recursos” donde el profe aporta información de mucho valor para repasar la lección.

Aquí hay otro aporte muy bueno acerca de Promesas y Observables, con Alan Buscaglia | Gentleman Programming

Entrevista Técnica de Angular - Promesas VS Observables

aquí quedo resuelta mi pregunta del porque no cancelábamos las suscripciones para el caso de las peticiones con HttpClient

Mis notas de esta clase

En un Observable se emite un stream de respuestas que se pueden obtener suscribiéndose al Observable. Por convención al crear un observable se pone $ al final del nombre. Angular usa Observables es muchos sitios, como en formularios reactivos, escuchar eventos dinámicos, hacer peticiones HTTP, etc.

import { Observable } from 'rxjs';

const doSomething$ = () }
	new Observable(observer => {
		observer.next('valor')
	})
}

• next() → Permite emitir un valor.

Suscribirse a un observable para obtener sus valores transmitidos.

const observable$ = doSomething()
observable$.suscribe(response => {
	console.log(response)
})

Ventajas de los Observables

• Se pueden emitir varios valores.

  const getAnObservable$ = () => {
      return new Observable(observer => {
          observer.next('Valor 1');
          observer.next('Valor 2');
          observer.next('Valor 3');
      });
   };
  

• Se puede cancelar la emisión de datos.

• Permite hacer transformaciones de los datos que se están recibiendo usando pipes():

  
  const { filter } = require('rxjs/operators');
  ...
  
  getAnObservable$
  .pipe(
    // Transformación de datos
  	filter(value => value !=== null)
  )
  
  .subscribe(res => {
  	console.log(res);
  });
  
  

Nota: cuando Angular hace una petición HTTP, al terminar la petición destruye el observable.

Excelente clase, muy importante la comparación Observable vs. Promise

Para convertir un Observable a Promise se usa:

// Angular  mayor a 13.* operador lastValueOf
lastValueOf( observable )
// Angular menor a 13.*
observable.asPromise()

Para convertir un Promise a Observable se usa:

// Angular  mayor a 13.* operador of
of(promise)

en Node 18 ya no ha necesidad del async .
La diferencia entre Promesa y Obsevable:
Promesa: Una sola respuesta, no es cancelable.
Observable: un Stream de de respuestas y es cancelable.

https://platzi.com/tutoriales/1789-asincronismo-js/5063-las-promesas-y-async-await-logicamente-no-son-iguales-y-te-explico-el-porque/

Aguante RXJS!!!

Sin dudas tomare el curso de Programación Reactiva con RxJS, lo dejare sin duda en mi lista de cursos que debo tomar despues de terminar la ruta de Angular o antes

Observable vs. Promesa

Angular usa Observables en vez de promesas por estas ventajas:

const { Observable } = require('rxjs');
const { filter } = require('rxjs/operators');

const doSomething = () => {
  return new Promise((resolve, reject) => {
    resolve('valor 1');
    resolve('valor 2'); //! no llega acá porque ya se resolvió
    setTimeout(() => {
      resolve('valor 3'); //! no llega acá porque ya se resolvió
    }, 2000);
  });
}

const doSomething$ = () => {
  return new Observable(observer => {
    observer.next('valor 1$');
    observer.next('valor 2$');
    observer.next('valor 3$');
    observer.next(null);
    setTimeout(() => {
      observer.next('valor 4$');
    }, 2000);
    setTimeout(() => {
      observer.next(null);
    }, 2500);
    setTimeout(() => {
      observer.next('valor 5$');
    }, 3000);
    //* podemos enviar varios datos porque estamos suscritos a ellos
  });
}

(async () => {
  const response = await doSomething();
  console.log(response);
})();

(() => {
  const obs$ = doSomething$();
  obs$.pipe(
    filter(value => value !== null)
  )
  .subscribe(response => {
    console.log(response);
  })
})();

Están muy buenas las clases pero hoy lunes 28/02/2022 el API proporcionado está caído, no se puede tener acceso.

que buena clase; he entendido demasiado con esto.

Muy buena explicacion. Me quedo mas claro