L’Outil Surpuissant pour Exploser ton Chiffre d'Affaires en 2024 !
Quand utiliser les promesses et les observables dans Angular
L’un des scénarios les plus déroutants est de savoir si je dois utiliser une promesse ou un observable.
Avez-vous déjà travaillé avec Promises et Observable ? Ou peut-être en avez-vous entendu parler mais ne savez pas lequel utiliser à quelle heure ? Pour éviter cette confusion, nous devons comprendre leurs différences afin de choisir celle qui convient le mieux à nos besoins. Cela dépend vraiment de votre application et de celle à utiliser.
Observables et promet les deux assister nous en travaillant avec asynchrone Fonctionnalité en JavaScript (angulaire).
Commençons notre discussion sur :
Promesses:
- Il peut émettre une seule valeur à la fois.
- Nous ne pouvons pas annuler les promesses.
- Ne soyez pas paresseux : exécutez immédiatement après la création.
- Il ne prend pas en charge les opérateurs tels que map, filter, reduction, retry, retryWhen et bien d’autres opérateurs RxJS.
Remarque : il existe Promise bibliothèques qui prennent en charge l’annulation, mais ES6 Promise pas jusqu’à présent.
Découvrez quelques exemples
Valeur émettrice :
var promise = new Promise(res => {
res("Hello To");
res("Hello The");
res("Hello New");
});
promise.then(console.log);
Chargement paresseux:
var promise = new Promise(res => {
console.log('Promise start executing...');
//In console can see this output before calling promise it will initialized on creation and eagerly load.
res('Hello....');
});
//Call promise
promise.then(console.log);
//Output
//Promise start executing...
//Hello....
Promesse asynchrone :
var promise = new Promise(res => {
console.log('Start Executing...');
res('Hello...');
console.log('Execution End...');
});
promise.then(console.log);
//Output
//Start Executing...
//Execution End...
//Hello...Observable:
- Les observables peuvent émettre plusieurs valeurs de manière asynchrone sous forme de flux de données.
- Nous pouvons annuler l’observable à tout moment.
- Sont paresseux : ils ne sont pas exécutés tant que nous ne nous y sommes pas abonnés à l’aide de la méthode Subscribe().
- Il prend en charge des opérateurs tels que map, filter, reduction, retry, retryWhen et bien d’autres opérateurs RxJS.
Découvrez quelques exemples :
Valeur émettrice :
var observable = new Observable(res => {
res.next('Hello To');
res.next('Hello The');
res.next('Hello New');
});
observable.subscribe(console.log);
//Output --> Observable can emmit multiple values
//Hello To
//Hello The
//Hello NewChargement paresseux:
var observable = new Observable(res => {
console.log("Observable start executing..."); // this line will not print untill subscribed
res.next('Hello....');
});
observable.subscribe(console.log); //Whenever subscribe observable then only it will emmit values beacuse it is lazy load.
//Output
//Observable start executing...
//Hello....
Observable asynchrone/synchrone :
//Async Observable
var observable = new Observable(res => {
console.log('Start Executing...');
setTimeout(() => {
res.next('Hello To');
res.next('Hello The');
res.next('Hello New');
}),
1000;
console.log('Execution End...');
});
observable.subscribe(console.log);
//Output
//Start Executing...
//Execution End...
//Hello To
//Hello The
//Hello New
//Sync Observable
var observable = new Observable(res => {
console.log('Start Executing...');
res.next('Hello To');
res.next('Hello The');
res.next('Hello New');
console.log('Execution End...');
});
observable.subscribe(console.log);
//Output
//Start Executing...
//Hello To
//Hello The
//Hello New
//Execution End...Conclusion:
Les observables et les promesses sont des composants fondamentaux des applications RxJS et JavaScript contemporaines. Alors que les Observables excellent dans la gestion de nombreux événements asynchrones au fil du temps, les Promises sont les mieux adaptées à la gestion de tâches asynchrones solitaires. Les deux sont des technologies efficaces pour faciliter la communication en temps réel entre différents composants d’application. Comprendre ces idées permet aux développeurs de sélectionner l’outil approprié pour différentes situations de programmation asynchrone, améliorant ainsi l’efficacité et la réactivité de leurs applications.
Source link