Maison  >  Article  >  interface Web  >  Observable vs Promesse

Observable vs Promesse

DDD
DDDoriginal
2024-11-27 21:22:11374parcourir

Observable v/s Promise

*Observables * et *Promises * sont tous deux utilisés pour gérer les opérations asynchrones en JavaScript, mais ils présentent quelques différences clés :

Promesses

  • Valeur unique : les promesses gèrent un seul événement asynchrone et renvoient une seule valeur (ou erreur).
  • Eager : les promesses commencent à s'exécuter immédiatement après la création.
  • Non annulable : une fois qu'une promesse est initiée, elle ne peut pas être annulée.
  • Syntaxe : utilise .then(), .catch() et .finally() pour les opérations de chaînage.

Exemple :

const promise = new Promise((resolve, reject) => {
  setTimeout(() => {
    resolve('Promise resolved!');
  }, 1000);
});

promise.then((value) => {
  console.log(value);
});

Observables

  • Valeurs multiples : les observables peuvent émettre plusieurs valeurs au fil du temps.
  • Paresseux : les observables ne commencent pas à émettre des valeurs tant qu'ils ne sont pas abonnés.
  • Annulable : les abonnements aux observables peuvent être annulés, arrêtant ainsi l'émission des valeurs.
  • Syntaxe : utilise .subscribe() pour gérer les valeurs émises, les erreurs et l'achèvement.

Exemple :

import { Observable } from 'rxjs';

const observable = new Observable((subscriber) => {
  subscriber.next('First value');
  setTimeout(() => {
    subscriber.next('Second value');
    subscriber.complete();
  }, 1000);
});

const subscription = observable.subscribe({
  next(value) {
    console.log(value);
  },
  complete() {
    console.log('Observable complete');
  }
});

// To cancel the subscription
subscription.unsubscribe();

Quand les utiliser

  • Utilisez Promises lorsque vous devez gérer une seule opération asynchrone.
  • Utilisez Observables lorsque vous devez gérer plusieurs événements ou valeurs asynchrones au fil du temps, et lorsque vous avez besoin de plus de contrôle sur le flux de données (par exemple, annulation, transformation).

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn