web-dev-qa-db-fra.com

Chaînage des observables dans RxJS

J'apprends RxJS et Angular 2. Supposons que j'ai une chaîne de promesses avec plusieurs appels de fonctions asynchrones qui dépendent du résultat précédent, qui ressemble à ceci:

var promiseChain = new Promise((resolve, reject) => {
  setTimeout(() => {
    resolve(1);
  }, 1000);
}).then((result) => {
  console.log(result);

  return new Promise((resolve, reject) => {
    setTimeout(() => {
      resolve(result + 2);
    }, 1000);
  });
}).then((result) => {
  console.log(result);

  return new Promise((resolve, reject) => {
      setTimeout(() => {
      resolve(result + 3);
        }, 1000);
  });
});

promiseChain.then((finalResult) => {
  console.log(finalResult);
});

Mes tentatives de faire de même en utilisant uniquement RxJS sans utiliser de promesses ont donné les résultats suivants:

var observableChain = Observable.create((observer) => {
  setTimeout(() => {
    observer.next(1);
    observer.complete();
  }, 1000);
}).flatMap((result) => {
  console.log(result);

  return Observable.create((observer) => {
    setTimeout(() => {
      observer.next(result + 2);
      observer.complete()
    }, 1000);
  });
}).flatMap((result) => {
  console.log(result);

  return Observable.create((observer) => {
    setTimeout(() => {
      observer.next(result + 3);
      observer.complete()
    }, 1000);
  });
});

observableChain.subscribe((finalResult) => {
  console.log(finalResult);
});

Il produit le même résultat que la chaîne de promesses. Mes questions sont

  1. Est-ce que je le fais bien? Existe-t-il des améliorations liées à RxJS que je peux apporter au code ci-dessus?

  2. Comment puis-je obtenir cette chaîne observable pour exécuter à plusieurs reprises? c’est-à-dire que l’ajout d’un autre abonnement à la fin ne produit que 6 exemplaires supplémentaires, mais j’espère qu’il en imprimera 1, 3 et 6.

    observableChain.subscribe ((finalResult) => {console.log (finalResult);});

    observableChain.subscribe ((finalResult) => {console.log (finalResult);});

    1 3 6 6

javascriptpromisereactive-programmingrxjsrxjs5
52
Harindaka

À propos de la composition de promesses par rapport à Rxjs, cette question étant fréquemment posée, vous pouvez vous référer à un certain nombre de questions précédemment posées sur les SO, notamment:

Fondamentalement, flatMap est l'équivalent de Promise.then.

Pour votre deuxième question, voulez-vous rejouer les valeurs déjà émises ou voulez-vous traiter les nouvelles valeurs au fur et à mesure de leur arrivée? Dans le premier cas, vérifiez l'opérateur publishReplay. Dans le second cas, un abonnement standard suffit. Cependant, vous devrez peut-être être conscient du froid. dichotomie chaude en fonction de votre source (cf. observables chauds et froids: existe-t-il des opérateurs "chauds" et "froids"? pour une explication illustrée du concept)

41
user3743222