javascript - tutorial - ¿Promise.todo comportamiento con RxJS Observables?

rxjs que es

Question

En Angular 1.x a veces necesito hacer múltiples solicitudes http y hacer algo con todas las respuestas. Promise.all(promises).then(function (results) {...}) todas las promesas en una matriz y llamaría a Promise.all(promises).then(function (results) {...}) .

Las mejores prácticas de Angular 2 parecen apuntar hacia el uso del Observable de RxJS como un reemplazo de las promesas en las solicitudes http . Si tengo dos o más Observables diferentes creados a partir de solicitudes http, ¿es equivalente a Promise.all() ?

Answer 1

En reactivex.io forkJoin en realidad apunta a Observable.zip() , que hizo el trabajo por mí:

let subscription = Observable.zip(obs1, obs2, ...).subscribe(...);

Answer 2

La alternativa más directa para emular Promise.all es usar el operador forkJoin (inicia todos los observables en paralelo y une sus últimos elementos):

• documentation
• enlace relacionado: cf. RxJS: concat tres promesas, distinguir resultados

Un poco fuera de alcance, pero en caso de que ayude, en el tema de encadenar promesas, puede usar un flatMap simple: Cf. RxJS Promise Composition (pasar datos)

Answer 3

forkJoin también funciona bien, pero prefiero combineLatest ya que no tiene que preocuparse de que tome el último valor de observables. De esta manera, puede actualizarse siempre que alguno de ellos emita un nuevo valor también (p. Ej., Busque un intervalo o algo así).

Answer 4

Actualización de mayo de 2019 con RxJs v6

Encontré útiles las otras respuestas y deseaba ofrecer un ejemplo de la respuesta ofrecida por Arnaud sobre zip uso de zip .

Aquí hay un fragmento que muestra la equivalencia entre Promise.all y el zip rxjs (tenga en cuenta también, en rxjs6 cómo zip se importa ahora usando "rxjs" y no como operador).

import { zip } from "rxjs";

const the_weather = new Promise(resolve => {
  setTimeout(() => {
    resolve({ temp: 29, conditions: "Sunny with Clouds" });
  }, 2000);
});

const the_tweets = new Promise(resolve => {
  setTimeout(() => {
    resolve(["I like cake", "BBQ is good too!"]);
  }, 500);
});

// Using RxJs
let source$ = zip(the_weather, the_tweets);
source$.subscribe(([weatherInfo, tweetInfo]) =>
  console.log(weatherInfo, tweetInfo)
);

// Using ES6 Promises
Promise.all([the_weather, the_tweets]).then(responses => {
  const [weatherInfo, tweetInfo] = responses;
  console.log(weatherInfo, tweetInfo);
});

La salida de ambos es la misma. Ejecutar lo anterior da:

{ temp: 29, conditions: ''Sunny with Clouds'' } [ ''I like cake'', ''BBQ is good too!'' ]
{ temp: 29, conditions: ''Sunny with Clouds'' } [ ''I like cake'', ''BBQ is good too!'' ]