From 844f5103992238c0c23203286dad16a466e89c97 Mon Sep 17 00:00:00 2001 From: julieng Date: Tue, 3 Aug 2021 08:03:09 +0200 Subject: move *.html to *.md --- .../global_objects/promise/all/index.html | 223 ----------------- .../reference/global_objects/promise/all/index.md | 223 +++++++++++++++++ .../global_objects/promise/allsettled/index.html | 65 ----- .../global_objects/promise/allsettled/index.md | 65 +++++ .../global_objects/promise/any/index.html | 146 ------------ .../reference/global_objects/promise/any/index.md | 146 ++++++++++++ .../global_objects/promise/catch/index.html | 161 ------------- .../global_objects/promise/catch/index.md | 161 +++++++++++++ .../global_objects/promise/finally/index.html | 105 -------- .../global_objects/promise/finally/index.md | 105 ++++++++ .../reference/global_objects/promise/index.html | 234 ------------------ .../reference/global_objects/promise/index.md | 234 ++++++++++++++++++ .../global_objects/promise/race/index.html | 188 --------------- .../reference/global_objects/promise/race/index.md | 188 +++++++++++++++ .../global_objects/promise/reject/index.html | 76 ------ .../global_objects/promise/reject/index.md | 76 ++++++ .../global_objects/promise/resolve/index.html | 153 ------------ .../global_objects/promise/resolve/index.md | 153 ++++++++++++ .../global_objects/promise/then/index.html | 264 --------------------- .../reference/global_objects/promise/then/index.md | 264 +++++++++++++++++++++ 20 files changed, 1615 insertions(+), 1615 deletions(-) delete mode 100644 files/fr/web/javascript/reference/global_objects/promise/all/index.html create mode 100644 files/fr/web/javascript/reference/global_objects/promise/all/index.md delete mode 100644 files/fr/web/javascript/reference/global_objects/promise/allsettled/index.html create mode 100644 files/fr/web/javascript/reference/global_objects/promise/allsettled/index.md delete mode 100644 files/fr/web/javascript/reference/global_objects/promise/any/index.html create mode 100644 files/fr/web/javascript/reference/global_objects/promise/any/index.md delete mode 100644 files/fr/web/javascript/reference/global_objects/promise/catch/index.html create mode 100644 files/fr/web/javascript/reference/global_objects/promise/catch/index.md delete mode 100644 files/fr/web/javascript/reference/global_objects/promise/finally/index.html create mode 100644 files/fr/web/javascript/reference/global_objects/promise/finally/index.md delete mode 100644 files/fr/web/javascript/reference/global_objects/promise/index.html create mode 100644 files/fr/web/javascript/reference/global_objects/promise/index.md delete mode 100644 files/fr/web/javascript/reference/global_objects/promise/race/index.html create mode 100644 files/fr/web/javascript/reference/global_objects/promise/race/index.md delete mode 100644 files/fr/web/javascript/reference/global_objects/promise/reject/index.html create mode 100644 files/fr/web/javascript/reference/global_objects/promise/reject/index.md delete mode 100644 files/fr/web/javascript/reference/global_objects/promise/resolve/index.html create mode 100644 files/fr/web/javascript/reference/global_objects/promise/resolve/index.md delete mode 100644 files/fr/web/javascript/reference/global_objects/promise/then/index.html create mode 100644 files/fr/web/javascript/reference/global_objects/promise/then/index.md (limited to 'files/fr/web/javascript/reference/global_objects/promise') diff --git a/files/fr/web/javascript/reference/global_objects/promise/all/index.html b/files/fr/web/javascript/reference/global_objects/promise/all/index.html deleted file mode 100644 index 1f62847df2..0000000000 --- a/files/fr/web/javascript/reference/global_objects/promise/all/index.html +++ /dev/null @@ -1,223 +0,0 @@ ---- -title: Promise.all() -slug: Web/JavaScript/Reference/Global_Objects/Promise/all -tags: - - ECMAScript 2015 - - JavaScript - - Méthode - - Promise - - Reference -translation_of: Web/JavaScript/Reference/Global_Objects/Promise/all -original_slug: Web/JavaScript/Reference/Objets_globaux/Promise/all ---- -
{{JSRef}}
- -

La méthode Promise.all() renvoie une promesse ({{jsxref("Promise")}}) qui est résolue lorsque l'ensemble des promesses contenues dans l'itérable passé en argument ont été résolues ou qui échoue avec la raison de la première promesse qui échoue au sein de l'itérable.

- -
{{EmbedInteractiveExample("pages/js/promise-all.html")}}
- -

Syntaxe

- -
Promise.all(iterable);
- -

Paramètres

- -
-
iterable
-
Un objet itérable (tel qu'un tableau ({{jsxref("Array")}})) contenant des promesses.
-
- -

Valeur de retour

- -

Un objet {{jsxref("Promise")}} qui est

- - - -

Description

- -

Cette méthode peut être utile lorsqu'on souhaite agréger le résultat de plusieurs promesses.

- -
-
Valeur de résolution
-
Si toutes les promesses de l'itérable sont tenues, Promise.all est tenue et la valeur de résolution est un tableau qui contient les valeurs de résolution respectives des promesses de l'itérable (dans le même ordre). Si l'argument utilisé est un tableau vide, la méthode résoud la promesse immédiatement et de façon synchrone.
-
Valeur d'échec
-
Si l'une des promesses de l'itérable échoue, Promise.all échoue immédiatement et utilise la raison de l'échec (que les autres promesses aient été résolues ou non).
-
- -

Exemples

- -

Utiliser Promise.all()

- -

Promise.all() attend que l'ensemble des promesses soient tenues ou qu'une promesse soit rompue :

- -
var p1 = Promise.resolve(3);
-var p2 = 1337;
-var p3 = new Promise((resolve, reject) => {
-  setTimeout(resolve, 100, 'foo');
-});
-
-Promise.all([p1, p2, p3]).then(values => {
-  console.log(values); // [3, 1337, "foo"]
-});
- -

Promise.all(), un échec rapide

- -

La promesse créée par Promise.all() échoue immédiatement si l'une des promesses échoue. Dans l'exemple suivant, on fournit quatre promesses qui sont résolues après une certaine durée et une autre promesse qui est rompue immédiatement : on peut alors voir que la promesse créée par Promise.all() est rompue immédiatement.

- -
var p1 = new Promise((resolve, reject) => {
-  setTimeout(resolve, 1000, 'un');
-});
-var p2 = new Promise((resolve, reject) => {
-  setTimeout(resolve, 2000, 'deux');
-});
-var p3 = new Promise((resolve, reject) => {
-  setTimeout(resolve, 3000, 'trois');
-});
-var p4 = new Promise((resolve, reject) => {
-  setTimeout(resolve, 4000, 'quatre');
-});
-var p5 = new Promise((resolve, reject) => {
-  reject('rejet');
-});
-
-Promise.all([p1, p2, p3, p4, p5]).then(values => {
-  console.log(values);
-}, reason => {
-  console.log(reason)
-});
-
-// Dans la console :
-// "rejet"
-
-//On peut aussi employer .catch
-Promise.all([p1, p2, p3, p4, p5]).then(values => {
-  console.log(values);
-}).catch(reason => {
-  console.log(reason)
-});
-
-// Dans la console :
-// "rejet"
-
-
- -

Il est possible de modifier ce comportement en gérant les éventuels échecs :

- -
var p1 = new Promise((resolve, reject) => {
-  setTimeout(resolve, 1000, 'p1_resolution_retardee');
-});
-
-var p2 = new Promise((resolve, reject) => {
-  reject(new Error('p2_rejet_immediat'));
-});
-
-Promise.all([
-  p1.catch(error => { return error }),
-  p2.catch(error => { return error }),
-]).then(values => {
-  console.log(values[0]); // "p1_resolution_retardee"
-  console.log(values[1]); // "Error: p2_rejet_immediat"
-})
-
- -

Caractère asynchrone de Promise.all()

- -

Dans l'exemple qui suit, on illustre le caractère asynchrone de Promise.all() (et son caractère synchrone quand l'itérable passé en argument est vide) :

- -
// On passe un tableau de promesses déjà résolues
-// afin de déclencher Promise.all dès que possible
-var resolvedPromisesArray = [Promise.resolve(33), Promise.resolve(44)];
-
-var p = Promise.all(resolvedPromisesArray);
-// on affiche la valeur de p dans la console
-console.log(p);
-
-// on utilise la méthode setTimeout pour exécuter
-// du code dès que la pile est vide
-setTimeout(function() {
-    console.log('La pile est vide');
-    console.log(p);
-});
-
-// Cela affichera dans la console (et dans cet ordre) :
-// Promise { <state>: "pending" }
-// La pile est vide
-// Promise { <state>: "fulfilled", <value>: Array[2] }
-
- -

On aura le même comportement si Promise.all produit une promesse rompue :

- -
var mixedPromisesArray = [Promise.resolve(33), Promise.reject(44)];
-var p = Promise.all(mixedPromisesArray);
-console.log(p);
-setTimeout(function() {
-    console.log('La pile est vide');
-    console.log(p);
-});
-
-// Affichera :
-// Promise { <state>: "pending" }
-// La pile est vide
-// Promise { <state>: "rejected", <reason>: 44 }
-
- -

En revanche, Promise.all produit une promesse résolue de façon synchrone si et seulement si l'itérable est vide :

- -
var p = Promise.all([]); // immédiatement résolue
-
-// les valeurs qui ne sont pas des promesses
-// seront ignorées mais l'évaluation sera effectuée
-// de façon asynchrone
-var p2 = Promise.all([1337, "hi"]);
-console.log(p);
-console.log(p2)
-setTimeout(function() {
-    console.log('La pile est vide');
-    console.log(p2);
-});
-
-// Affichera :
-// Promise { <state>: "fulfilled", <value>: Array[0] }
-// Promise { <state>: "pending" }
-// La pile est vide
-// Promise { <state>: "fulfilled", <value>: Array[2] }
-
- -

Spécifications

- - - - - - - - - - - - - - - - - - - - - -
SpécificationÉtatCommentaires
{{SpecName('ES2015', '#sec-promise.all', 'Promise.all')}}{{Spec2('ES2015')}}Définition initiale dans un standard ECMA.
{{SpecName('ESDraft', '#sec-promise.all', 'Promise.all')}}{{Spec2('ESDraft')}} 
- -

Compatibilité des navigateurs

- -

{{Compat("javascript.builtins.Promise.all")}}

- -

Voir aussi

- - diff --git a/files/fr/web/javascript/reference/global_objects/promise/all/index.md b/files/fr/web/javascript/reference/global_objects/promise/all/index.md new file mode 100644 index 0000000000..1f62847df2 --- /dev/null +++ b/files/fr/web/javascript/reference/global_objects/promise/all/index.md @@ -0,0 +1,223 @@ +--- +title: Promise.all() +slug: Web/JavaScript/Reference/Global_Objects/Promise/all +tags: + - ECMAScript 2015 + - JavaScript + - Méthode + - Promise + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Promise/all +original_slug: Web/JavaScript/Reference/Objets_globaux/Promise/all +--- +
{{JSRef}}
+ +

La méthode Promise.all() renvoie une promesse ({{jsxref("Promise")}}) qui est résolue lorsque l'ensemble des promesses contenues dans l'itérable passé en argument ont été résolues ou qui échoue avec la raison de la première promesse qui échoue au sein de l'itérable.

+ +
{{EmbedInteractiveExample("pages/js/promise-all.html")}}
+ +

Syntaxe

+ +
Promise.all(iterable);
+ +

Paramètres

+ +
+
iterable
+
Un objet itérable (tel qu'un tableau ({{jsxref("Array")}})) contenant des promesses.
+
+ +

Valeur de retour

+ +

Un objet {{jsxref("Promise")}} qui est

+ + + +

Description

+ +

Cette méthode peut être utile lorsqu'on souhaite agréger le résultat de plusieurs promesses.

+ +
+
Valeur de résolution
+
Si toutes les promesses de l'itérable sont tenues, Promise.all est tenue et la valeur de résolution est un tableau qui contient les valeurs de résolution respectives des promesses de l'itérable (dans le même ordre). Si l'argument utilisé est un tableau vide, la méthode résoud la promesse immédiatement et de façon synchrone.
+
Valeur d'échec
+
Si l'une des promesses de l'itérable échoue, Promise.all échoue immédiatement et utilise la raison de l'échec (que les autres promesses aient été résolues ou non).
+
+ +

Exemples

+ +

Utiliser Promise.all()

+ +

Promise.all() attend que l'ensemble des promesses soient tenues ou qu'une promesse soit rompue :

+ +
var p1 = Promise.resolve(3);
+var p2 = 1337;
+var p3 = new Promise((resolve, reject) => {
+  setTimeout(resolve, 100, 'foo');
+});
+
+Promise.all([p1, p2, p3]).then(values => {
+  console.log(values); // [3, 1337, "foo"]
+});
+ +

Promise.all(), un échec rapide

+ +

La promesse créée par Promise.all() échoue immédiatement si l'une des promesses échoue. Dans l'exemple suivant, on fournit quatre promesses qui sont résolues après une certaine durée et une autre promesse qui est rompue immédiatement : on peut alors voir que la promesse créée par Promise.all() est rompue immédiatement.

+ +
var p1 = new Promise((resolve, reject) => {
+  setTimeout(resolve, 1000, 'un');
+});
+var p2 = new Promise((resolve, reject) => {
+  setTimeout(resolve, 2000, 'deux');
+});
+var p3 = new Promise((resolve, reject) => {
+  setTimeout(resolve, 3000, 'trois');
+});
+var p4 = new Promise((resolve, reject) => {
+  setTimeout(resolve, 4000, 'quatre');
+});
+var p5 = new Promise((resolve, reject) => {
+  reject('rejet');
+});
+
+Promise.all([p1, p2, p3, p4, p5]).then(values => {
+  console.log(values);
+}, reason => {
+  console.log(reason)
+});
+
+// Dans la console :
+// "rejet"
+
+//On peut aussi employer .catch
+Promise.all([p1, p2, p3, p4, p5]).then(values => {
+  console.log(values);
+}).catch(reason => {
+  console.log(reason)
+});
+
+// Dans la console :
+// "rejet"
+
+
+ +

Il est possible de modifier ce comportement en gérant les éventuels échecs :

+ +
var p1 = new Promise((resolve, reject) => {
+  setTimeout(resolve, 1000, 'p1_resolution_retardee');
+});
+
+var p2 = new Promise((resolve, reject) => {
+  reject(new Error('p2_rejet_immediat'));
+});
+
+Promise.all([
+  p1.catch(error => { return error }),
+  p2.catch(error => { return error }),
+]).then(values => {
+  console.log(values[0]); // "p1_resolution_retardee"
+  console.log(values[1]); // "Error: p2_rejet_immediat"
+})
+
+ +

Caractère asynchrone de Promise.all()

+ +

Dans l'exemple qui suit, on illustre le caractère asynchrone de Promise.all() (et son caractère synchrone quand l'itérable passé en argument est vide) :

+ +
// On passe un tableau de promesses déjà résolues
+// afin de déclencher Promise.all dès que possible
+var resolvedPromisesArray = [Promise.resolve(33), Promise.resolve(44)];
+
+var p = Promise.all(resolvedPromisesArray);
+// on affiche la valeur de p dans la console
+console.log(p);
+
+// on utilise la méthode setTimeout pour exécuter
+// du code dès que la pile est vide
+setTimeout(function() {
+    console.log('La pile est vide');
+    console.log(p);
+});
+
+// Cela affichera dans la console (et dans cet ordre) :
+// Promise { <state>: "pending" }
+// La pile est vide
+// Promise { <state>: "fulfilled", <value>: Array[2] }
+
+ +

On aura le même comportement si Promise.all produit une promesse rompue :

+ +
var mixedPromisesArray = [Promise.resolve(33), Promise.reject(44)];
+var p = Promise.all(mixedPromisesArray);
+console.log(p);
+setTimeout(function() {
+    console.log('La pile est vide');
+    console.log(p);
+});
+
+// Affichera :
+// Promise { <state>: "pending" }
+// La pile est vide
+// Promise { <state>: "rejected", <reason>: 44 }
+
+ +

En revanche, Promise.all produit une promesse résolue de façon synchrone si et seulement si l'itérable est vide :

+ +
var p = Promise.all([]); // immédiatement résolue
+
+// les valeurs qui ne sont pas des promesses
+// seront ignorées mais l'évaluation sera effectuée
+// de façon asynchrone
+var p2 = Promise.all([1337, "hi"]);
+console.log(p);
+console.log(p2)
+setTimeout(function() {
+    console.log('La pile est vide');
+    console.log(p2);
+});
+
+// Affichera :
+// Promise { <state>: "fulfilled", <value>: Array[0] }
+// Promise { <state>: "pending" }
+// La pile est vide
+// Promise { <state>: "fulfilled", <value>: Array[2] }
+
+ +

Spécifications

+ + + + + + + + + + + + + + + + + + + + + +
SpécificationÉtatCommentaires
{{SpecName('ES2015', '#sec-promise.all', 'Promise.all')}}{{Spec2('ES2015')}}Définition initiale dans un standard ECMA.
{{SpecName('ESDraft', '#sec-promise.all', 'Promise.all')}}{{Spec2('ESDraft')}} 
+ +

Compatibilité des navigateurs

+ +

{{Compat("javascript.builtins.Promise.all")}}

+ +

Voir aussi

+ + diff --git a/files/fr/web/javascript/reference/global_objects/promise/allsettled/index.html b/files/fr/web/javascript/reference/global_objects/promise/allsettled/index.html deleted file mode 100644 index 0c3a050b1f..0000000000 --- a/files/fr/web/javascript/reference/global_objects/promise/allsettled/index.html +++ /dev/null @@ -1,65 +0,0 @@ ---- -title: Promise.allSettled() -slug: Web/JavaScript/Reference/Global_Objects/Promise/allSettled -tags: - - JavaScript - - Méthode - - Promise - - Reference -translation_of: Web/JavaScript/Reference/Global_Objects/Promise/allSettled -original_slug: Web/JavaScript/Reference/Objets_globaux/Promise/allSettled ---- -

{{JSRef}}

- -

La méthode Promise.allSettled() renvoie une promesse qui est résolue une fois que l'ensemble des promesses de l'itérable passée en argument sont réussies ou rejetées. La valeur de résolution de cette promesse est un tableau d'objets dont chacun est le résultat de chaque promesse de l'itérable.

- -
{{EmbedInteractiveExample("pages/js/promise-allsettled.html")}}
- -

Syntaxe

- -
p.allSettled(iterable);
- -

Paramètres

- -
-
iterable
-
Un objet itérable tel qu'un tableau ({{jsxref("Array")}}) dont chaque élément est une promesse ({{jsxref("Promise")}}.
-
- -

Valeur de retour

- -

Une promesse ({{jsxref("Promise")}}) en cours qui sera résolue de façon asynchrone une fois que chaque promesse de l'itérable a été résolue (tenue/réussie ou rejetée/échouée). Le gestionnaire passé à la promesse retournée recevra comme argument un tableau de valeur dont chacune est le résultat de chaque promesse de l'itérable initial.

- -

Pour chaque objet contenu dans ce tableau, il y aura une propriété status qui est une chaîne de caractères. Si status vaut fulfilled, alors on aura une propriété value. Si status vaut rejected, alors une propriété reason sera présente. La valeur (ou la raison) reflète la valeur de résolution de la promesse.

- -

Spécifications

- - - - - - - - - - - - - - - - -
SpécificationÉtatCommentaires
Promise.allSettled() (Brouillon TC39 au niveau 4){{Spec2('ESDraft')}}
- -

Compatibilité des navigateurs

- -

{{Compat("javascript.builtins.Promise.allSettled")}}

- -

Voir aussi

- - diff --git a/files/fr/web/javascript/reference/global_objects/promise/allsettled/index.md b/files/fr/web/javascript/reference/global_objects/promise/allsettled/index.md new file mode 100644 index 0000000000..0c3a050b1f --- /dev/null +++ b/files/fr/web/javascript/reference/global_objects/promise/allsettled/index.md @@ -0,0 +1,65 @@ +--- +title: Promise.allSettled() +slug: Web/JavaScript/Reference/Global_Objects/Promise/allSettled +tags: + - JavaScript + - Méthode + - Promise + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Promise/allSettled +original_slug: Web/JavaScript/Reference/Objets_globaux/Promise/allSettled +--- +

{{JSRef}}

+ +

La méthode Promise.allSettled() renvoie une promesse qui est résolue une fois que l'ensemble des promesses de l'itérable passée en argument sont réussies ou rejetées. La valeur de résolution de cette promesse est un tableau d'objets dont chacun est le résultat de chaque promesse de l'itérable.

+ +
{{EmbedInteractiveExample("pages/js/promise-allsettled.html")}}
+ +

Syntaxe

+ +
p.allSettled(iterable);
+ +

Paramètres

+ +
+
iterable
+
Un objet itérable tel qu'un tableau ({{jsxref("Array")}}) dont chaque élément est une promesse ({{jsxref("Promise")}}.
+
+ +

Valeur de retour

+ +

Une promesse ({{jsxref("Promise")}}) en cours qui sera résolue de façon asynchrone une fois que chaque promesse de l'itérable a été résolue (tenue/réussie ou rejetée/échouée). Le gestionnaire passé à la promesse retournée recevra comme argument un tableau de valeur dont chacune est le résultat de chaque promesse de l'itérable initial.

+ +

Pour chaque objet contenu dans ce tableau, il y aura une propriété status qui est une chaîne de caractères. Si status vaut fulfilled, alors on aura une propriété value. Si status vaut rejected, alors une propriété reason sera présente. La valeur (ou la raison) reflète la valeur de résolution de la promesse.

+ +

Spécifications

+ + + + + + + + + + + + + + + + +
SpécificationÉtatCommentaires
Promise.allSettled() (Brouillon TC39 au niveau 4){{Spec2('ESDraft')}}
+ +

Compatibilité des navigateurs

+ +

{{Compat("javascript.builtins.Promise.allSettled")}}

+ +

Voir aussi

+ + diff --git a/files/fr/web/javascript/reference/global_objects/promise/any/index.html b/files/fr/web/javascript/reference/global_objects/promise/any/index.html deleted file mode 100644 index a7ac089348..0000000000 --- a/files/fr/web/javascript/reference/global_objects/promise/any/index.html +++ /dev/null @@ -1,146 +0,0 @@ ---- -title: Promise.any() -slug: Web/JavaScript/Reference/Global_Objects/Promise/any -tags: - - JavaScript - - Method - - Méthode - - Promise - - Reference -translation_of: Web/JavaScript/Reference/Global_Objects/Promise/any -original_slug: Web/JavaScript/Reference/Objets_globaux/Promise/any ---- -
{{JSRef}}
- -

La méthode Promise.any() prend comme argument un itérable contenant des objets {{JSxRef("Promise")}} et, dès qu'une des promesses de cet itérable est tenue, renvoie une unique promesse résolue avec la valeur de la promesse résolue. Si aucune promesse de l'itérable n'est tenue (c'est-à-dire si toutes les promesses sont rejetées), la promesse renvoyée est rompue avec un objet {{JSxRef("Objets_globaux/AggregateError", "AggregateError")}} (une nouvelle sous-classe de {{JSxRef("Error")}} qui regroupe un ensemble d'erreurs). Cette méthode fait essentiellement le contraire de {{JSxRef("Promise.all()")}} (qui renvoie une promesse tenue uniquement si toutes les promesses de l'itérable passé en argument ont été tenues).

- -

{{EmbedInteractiveExample("pages/js/promise-any.html")}}

- -

Syntaxe

- -
Promise.any(iterable);
- -

Paramètres

- -
-
iterable
-
Un objet itérable tel qu'un tableau ({{JSxRef("Array")}}) contenant des promesses ({{jsxref("Promise")}}).
-
- -

Valeur de retour

- - - -

Description

- -

Cette méthode est utile afin de renvoyer la première promesse tenue d'un ensemble de promesse. Elle permet de court-circuiter dès qu'une promesse est tenue, sans attendre que les autres promesses soient résolues. Contrairement à {{JSxRef("Promise.all()")}} qui renvoie un tableau avec les valeurs de résolution des promesses, on a ici une seule valeur de résolution (celle de la première promesse tenue). Ce peut être bénéfique lorsqu'on a un ensemble de promesses et qu'on ne souhaite en résoudre qu'une sans se soucier de savoir laquelle des promesses a été tenue en premier.

- -

À la différence de {{JSxRef("Promise.race()")}} qui renvoie la valeur de la première promesse résolue (qu'elle ait été tenue ou rompue), Promise.any() renvoie une promesse avec la valeur de la première promesse tenue. Cette méthode ignore les promesses qui sont rompues jusqu'à obtenir une promesse tenue.

- -

Une des promesses est tenue

- -

La promesse renvoyée par Promise.any() est résolue avec la première valeur résolue de l'itérable, qu'il s'agisse d'une promesse ou non, et que les autres promesses de l'itérable aient échoué ou non.

- - - -

Toutes les promesses sont rompues

- -

Si toutes les promesses de l'itérable échouent, Promise.any() échoue de asynchrone avec pour valeur d'échec un objet {{JSxRef("Objets_globaux/AggregateError", "AggregateError")}}, qui étend {{JSxRef("Error")}}, et contient une propriété errors qui est un tableau contenant l'ensemble des valeurs d'échec des différentes promesses de l'itérable.

- - - -

Exemples

- -

Première résolue

- -

Promise.any() prend pour valeur de résolution celle de la première promesse résolue, et ce même si une des promesses de l'itérable a échoué avant. Ce comportement est différent de ce {{JSxRef("Promise.race()")}}, qui s'arrête à la première promesse qui se termine avec sa valeur de résolution ou d'échec.

- -
const pErr = new Promise((resolve, reject) => {
-  reject("J'échoue toujours");
-});
-
-const pLente = new Promise((resolve, reject) => {
-  setTimeout(resolve, 500, "Éventuellement résolue");
-});
-
-const pRapide = new Promise((resolve, reject) => {
-  setTimeout(resolve, 100, "Rapidement résolue");
-});
-
-Promise.any([pErr, pLente, pRapide]).then((valeur) => {
-  console.log(valeur);
-  // pRapide s'est résolue en premier
-});
-// résultat attendu : "Rapidement résolue"
- -

Échec avec AggregateError

- -

Promise.any() échoue avec un objet {{JSxRef("AggregateError")}} si aucun des promesses n'est résolue.

- -
const pErr = new Promise((resolve, reject) => {
-  reject("J'échoue toujours");
-});
-
-Promise.any([pErr]).catch((err) => {
-  console.log(err);
-})
-// résultat attendu : "AggregateError: No Promise in Promise.any was resolved"
- -

Afficher la première image chargée

- -

Dans cet exemple, nous avons une fonction qui requête une image et retourne un Blob. Nous utilisons Promise.any() pour requêter plusieurs images et afficher la première qui nous sera disponible (c'est-à-dire dont la promesse sera résolue).

- -
function fetchAndDecode(url) {
-  return fetch(url).then(réponse => {
-    if (!réponse.ok)
-      throw new Error(`Erreur HTTP ! état : ${response.status}`);
-    else
-      return réponse.blob();
-  })
-}
-
-let café = fetchAndDecode('coffee.jpg');
-let thé = fetchAndDecode('tea.jpg');
-
-Promise.any([café, thé]).then(valeur => {
-  let URLobjet = URL.createObjectURL(valeur);
-  let image = document.createElement('img');
-  image.src = URLobjet;
-  document.body.appendChild(image);
-})
-.catch(e => {
-  console.log(e.message);
-});
- -

Spécifications

- - - - - - - - - - -
Spécification
{{SpecName('Promise.any')}}
- -

Compatibilité des navigateurs

- -

{{Compat("javascript.builtins.Promise.any")}}

- -

Voir aussi

- - diff --git a/files/fr/web/javascript/reference/global_objects/promise/any/index.md b/files/fr/web/javascript/reference/global_objects/promise/any/index.md new file mode 100644 index 0000000000..a7ac089348 --- /dev/null +++ b/files/fr/web/javascript/reference/global_objects/promise/any/index.md @@ -0,0 +1,146 @@ +--- +title: Promise.any() +slug: Web/JavaScript/Reference/Global_Objects/Promise/any +tags: + - JavaScript + - Method + - Méthode + - Promise + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Promise/any +original_slug: Web/JavaScript/Reference/Objets_globaux/Promise/any +--- +
{{JSRef}}
+ +

La méthode Promise.any() prend comme argument un itérable contenant des objets {{JSxRef("Promise")}} et, dès qu'une des promesses de cet itérable est tenue, renvoie une unique promesse résolue avec la valeur de la promesse résolue. Si aucune promesse de l'itérable n'est tenue (c'est-à-dire si toutes les promesses sont rejetées), la promesse renvoyée est rompue avec un objet {{JSxRef("Objets_globaux/AggregateError", "AggregateError")}} (une nouvelle sous-classe de {{JSxRef("Error")}} qui regroupe un ensemble d'erreurs). Cette méthode fait essentiellement le contraire de {{JSxRef("Promise.all()")}} (qui renvoie une promesse tenue uniquement si toutes les promesses de l'itérable passé en argument ont été tenues).

+ +

{{EmbedInteractiveExample("pages/js/promise-any.html")}}

+ +

Syntaxe

+ +
Promise.any(iterable);
+ +

Paramètres

+ +
+
iterable
+
Un objet itérable tel qu'un tableau ({{JSxRef("Array")}}) contenant des promesses ({{jsxref("Promise")}}).
+
+ +

Valeur de retour

+ + + +

Description

+ +

Cette méthode est utile afin de renvoyer la première promesse tenue d'un ensemble de promesse. Elle permet de court-circuiter dès qu'une promesse est tenue, sans attendre que les autres promesses soient résolues. Contrairement à {{JSxRef("Promise.all()")}} qui renvoie un tableau avec les valeurs de résolution des promesses, on a ici une seule valeur de résolution (celle de la première promesse tenue). Ce peut être bénéfique lorsqu'on a un ensemble de promesses et qu'on ne souhaite en résoudre qu'une sans se soucier de savoir laquelle des promesses a été tenue en premier.

+ +

À la différence de {{JSxRef("Promise.race()")}} qui renvoie la valeur de la première promesse résolue (qu'elle ait été tenue ou rompue), Promise.any() renvoie une promesse avec la valeur de la première promesse tenue. Cette méthode ignore les promesses qui sont rompues jusqu'à obtenir une promesse tenue.

+ +

Une des promesses est tenue

+ +

La promesse renvoyée par Promise.any() est résolue avec la première valeur résolue de l'itérable, qu'il s'agisse d'une promesse ou non, et que les autres promesses de l'itérable aient échoué ou non.

+ + + +

Toutes les promesses sont rompues

+ +

Si toutes les promesses de l'itérable échouent, Promise.any() échoue de asynchrone avec pour valeur d'échec un objet {{JSxRef("Objets_globaux/AggregateError", "AggregateError")}}, qui étend {{JSxRef("Error")}}, et contient une propriété errors qui est un tableau contenant l'ensemble des valeurs d'échec des différentes promesses de l'itérable.

+ + + +

Exemples

+ +

Première résolue

+ +

Promise.any() prend pour valeur de résolution celle de la première promesse résolue, et ce même si une des promesses de l'itérable a échoué avant. Ce comportement est différent de ce {{JSxRef("Promise.race()")}}, qui s'arrête à la première promesse qui se termine avec sa valeur de résolution ou d'échec.

+ +
const pErr = new Promise((resolve, reject) => {
+  reject("J'échoue toujours");
+});
+
+const pLente = new Promise((resolve, reject) => {
+  setTimeout(resolve, 500, "Éventuellement résolue");
+});
+
+const pRapide = new Promise((resolve, reject) => {
+  setTimeout(resolve, 100, "Rapidement résolue");
+});
+
+Promise.any([pErr, pLente, pRapide]).then((valeur) => {
+  console.log(valeur);
+  // pRapide s'est résolue en premier
+});
+// résultat attendu : "Rapidement résolue"
+ +

Échec avec AggregateError

+ +

Promise.any() échoue avec un objet {{JSxRef("AggregateError")}} si aucun des promesses n'est résolue.

+ +
const pErr = new Promise((resolve, reject) => {
+  reject("J'échoue toujours");
+});
+
+Promise.any([pErr]).catch((err) => {
+  console.log(err);
+})
+// résultat attendu : "AggregateError: No Promise in Promise.any was resolved"
+ +

Afficher la première image chargée

+ +

Dans cet exemple, nous avons une fonction qui requête une image et retourne un Blob. Nous utilisons Promise.any() pour requêter plusieurs images et afficher la première qui nous sera disponible (c'est-à-dire dont la promesse sera résolue).

+ +
function fetchAndDecode(url) {
+  return fetch(url).then(réponse => {
+    if (!réponse.ok)
+      throw new Error(`Erreur HTTP ! état : ${response.status}`);
+    else
+      return réponse.blob();
+  })
+}
+
+let café = fetchAndDecode('coffee.jpg');
+let thé = fetchAndDecode('tea.jpg');
+
+Promise.any([café, thé]).then(valeur => {
+  let URLobjet = URL.createObjectURL(valeur);
+  let image = document.createElement('img');
+  image.src = URLobjet;
+  document.body.appendChild(image);
+})
+.catch(e => {
+  console.log(e.message);
+});
+ +

Spécifications

+ + + + + + + + + + +
Spécification
{{SpecName('Promise.any')}}
+ +

Compatibilité des navigateurs

+ +

{{Compat("javascript.builtins.Promise.any")}}

+ +

Voir aussi

+ + diff --git a/files/fr/web/javascript/reference/global_objects/promise/catch/index.html b/files/fr/web/javascript/reference/global_objects/promise/catch/index.html deleted file mode 100644 index eccaacb0cc..0000000000 --- a/files/fr/web/javascript/reference/global_objects/promise/catch/index.html +++ /dev/null @@ -1,161 +0,0 @@ ---- -title: Promise.prototype.catch() -slug: Web/JavaScript/Reference/Global_Objects/Promise/catch -tags: - - ECMAScript 2015 - - JavaScript - - Méthode - - Promise - - Prototype - - Reference -translation_of: Web/JavaScript/Reference/Global_Objects/Promise/catch -original_slug: Web/JavaScript/Reference/Objets_globaux/Promise/catch ---- -
{{JSRef}}
- -

La méthode catch() renvoie un objet {{jsxref("Promise")}} et ne traite que des cas où la promesse initiale est rejetée. Elle a le même effet qu'un appel à {{jsxref("Promise.then", "Promise.prototype.then(undefined, siRejetée)")}} (c'est en fait ce qui se passe dans le moteur, obj.catch(onRejected) est traduit en obj.then(undefined, onRejected)). Cela signifie qu'il est nécessaire de fournir une fonction onRejected, même si on souhaite avoir une valeur de secours qui est undefined (par exemple avec obj.catch(() => {}).

- -
{{EmbedInteractiveExample("pages/js/promise-catch.html")}}
- -

Syntaxe

- -
p.catch(siRejetée);
-
-p.catch(function(raison) {
-   // rejet
-});
-
- -

Paramètres

- -
-
siRejetée
-
Une {{jsxref("Function","fonction","",1)}} à appeler si la Promise est rejetée (i.e. n'est pas tenue). Cette fonction possède un argument : -
-
raison
-
Une chaîne de caractères qui indique pourquoi la promesse n'est pas tenue.
-
- -

La promesse renvoyée par la méthode catch() est rompue si siRejetée lève une erreur ou si elle renvoie une promesse rompue. Dans les autres cas, elle est tenue.

-
-
- -

Valeur de retour

- -

Une promesse ({{jsxref("Promise")}}).

- -

Description

- -

La méthode catch() est utile pour gérer les cas d'erreur en cas de compositions de plusieurs promesses. Elle renvoie elle-même une promesse et peut donc être utilisée lorsqu'on chaîne des promesses, à l'instar de la méthode sœur qu'est {{jsxref("Promise.prototype.then()")}}.

- -

Exemples

- -

Utilisation de la méthode catch

- -
var p1 = new Promise(function(resolve, reject) {
-  resolve("Succès");
-});
-
-p1.then(function(value) {
-  console.log(value); // "Succès!"
-  throw new Error("zut !");
-}).catch(function(e) {
-  console.error(e.message); // "zut !"
-}).then(function(e) {
-   console.log('après le catch, la chaîne est restaurée');
-});
-
-// Le code qui suit est équivalent :
-p1.then(function(value) {
-  console.log(value); // "Succès!"
-  return Promise.reject('zut !');
-}).catch(function(e) {
-  console.log(e); // "zut !"
-}).then(function(e){
-  console.log('après le catch, la chaîne est restaurée');
-});
-
- -

Les promesses n'interceptent pas les exceptions levées de façon asynchrone

- -
var p1 = new Promise(function(resolve, reject) {
-  throw new Error('Oh oh!');
-});
-
-p1.catch(function(e) {
-  console.log(e.message); // "Oh oh!"
-});
-
-var p2 = new Promise(function(resolve, reject) {
-  setTimeout(function() {
-    throw new Error('Exception invisible !');
-  }, 1000);
-});
-
-p2.catch(function(e) {
-  console.log(e.message); // Cela n'est jamais appelé
-});
- -

Démonstration de l'appel interne à then

- -
// On surcharge Promise.prototype.then/catch
-// pour y ajouter des logs
-(function(Promise){
-    var originalThen = Promise.prototype.then;
-    var originalCatch = Promise.prototype.catch;
-
-    Promise.prototype.then = function(){
-        console.log('> > > > > > appel de .then sur %o avec les arguments: %o', this, arguments);
-        return originalThen.apply(this, arguments);
-    };
-    Promise.prototype.catch = function(){
-        console.log('> > > > > > appel de .catch sur %o avec les arguments: %o', this, arguments);
-        return originalCatch.apply(this, arguments);
-    };
-
-})(this.Promise);
-
-
-
-// On appelle catch sur une promesse déjà résolue
-Promise.resolve().catch(function XXX(){});
-
-// Dans la console, on aura :
-// > > > > > > appel de .catch sur Promise{} avec les arguments: Arguments{1} [0: function XXX()]
-// > > > > > > appel de .then sur Promise{} avec les arguments: Arguments{2} [0: undefined, 1: function XXX()]
-
- -

Spécifications

- - - - - - - - - - - - - - - - - - - - - -
SpécificationÉtatCommentaires
{{SpecName('ES2015', '#sec-promise.prototype.catch', 'Promise.prototype.catch')}}{{Spec2('ES2015')}}Définition initiale au sein d'un standard ECMA.
{{SpecName('ESDraft', '#sec-promise.prototype.catch', 'Promise.prototype.catch')}}{{Spec2('ESDraft')}}
- -

Compatibilité des navigateurs

- -

{{Compat("javascript.builtins.Promise.catch")}}

- -

Voir aussi

- - diff --git a/files/fr/web/javascript/reference/global_objects/promise/catch/index.md b/files/fr/web/javascript/reference/global_objects/promise/catch/index.md new file mode 100644 index 0000000000..eccaacb0cc --- /dev/null +++ b/files/fr/web/javascript/reference/global_objects/promise/catch/index.md @@ -0,0 +1,161 @@ +--- +title: Promise.prototype.catch() +slug: Web/JavaScript/Reference/Global_Objects/Promise/catch +tags: + - ECMAScript 2015 + - JavaScript + - Méthode + - Promise + - Prototype + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Promise/catch +original_slug: Web/JavaScript/Reference/Objets_globaux/Promise/catch +--- +
{{JSRef}}
+ +

La méthode catch() renvoie un objet {{jsxref("Promise")}} et ne traite que des cas où la promesse initiale est rejetée. Elle a le même effet qu'un appel à {{jsxref("Promise.then", "Promise.prototype.then(undefined, siRejetée)")}} (c'est en fait ce qui se passe dans le moteur, obj.catch(onRejected) est traduit en obj.then(undefined, onRejected)). Cela signifie qu'il est nécessaire de fournir une fonction onRejected, même si on souhaite avoir une valeur de secours qui est undefined (par exemple avec obj.catch(() => {}).

+ +
{{EmbedInteractiveExample("pages/js/promise-catch.html")}}
+ +

Syntaxe

+ +
p.catch(siRejetée);
+
+p.catch(function(raison) {
+   // rejet
+});
+
+ +

Paramètres

+ +
+
siRejetée
+
Une {{jsxref("Function","fonction","",1)}} à appeler si la Promise est rejetée (i.e. n'est pas tenue). Cette fonction possède un argument : +
+
raison
+
Une chaîne de caractères qui indique pourquoi la promesse n'est pas tenue.
+
+ +

La promesse renvoyée par la méthode catch() est rompue si siRejetée lève une erreur ou si elle renvoie une promesse rompue. Dans les autres cas, elle est tenue.

+
+
+ +

Valeur de retour

+ +

Une promesse ({{jsxref("Promise")}}).

+ +

Description

+ +

La méthode catch() est utile pour gérer les cas d'erreur en cas de compositions de plusieurs promesses. Elle renvoie elle-même une promesse et peut donc être utilisée lorsqu'on chaîne des promesses, à l'instar de la méthode sœur qu'est {{jsxref("Promise.prototype.then()")}}.

+ +

Exemples

+ +

Utilisation de la méthode catch

+ +
var p1 = new Promise(function(resolve, reject) {
+  resolve("Succès");
+});
+
+p1.then(function(value) {
+  console.log(value); // "Succès!"
+  throw new Error("zut !");
+}).catch(function(e) {
+  console.error(e.message); // "zut !"
+}).then(function(e) {
+   console.log('après le catch, la chaîne est restaurée');
+});
+
+// Le code qui suit est équivalent :
+p1.then(function(value) {
+  console.log(value); // "Succès!"
+  return Promise.reject('zut !');
+}).catch(function(e) {
+  console.log(e); // "zut !"
+}).then(function(e){
+  console.log('après le catch, la chaîne est restaurée');
+});
+
+ +

Les promesses n'interceptent pas les exceptions levées de façon asynchrone

+ +
var p1 = new Promise(function(resolve, reject) {
+  throw new Error('Oh oh!');
+});
+
+p1.catch(function(e) {
+  console.log(e.message); // "Oh oh!"
+});
+
+var p2 = new Promise(function(resolve, reject) {
+  setTimeout(function() {
+    throw new Error('Exception invisible !');
+  }, 1000);
+});
+
+p2.catch(function(e) {
+  console.log(e.message); // Cela n'est jamais appelé
+});
+ +

Démonstration de l'appel interne à then

+ +
// On surcharge Promise.prototype.then/catch
+// pour y ajouter des logs
+(function(Promise){
+    var originalThen = Promise.prototype.then;
+    var originalCatch = Promise.prototype.catch;
+
+    Promise.prototype.then = function(){
+        console.log('> > > > > > appel de .then sur %o avec les arguments: %o', this, arguments);
+        return originalThen.apply(this, arguments);
+    };
+    Promise.prototype.catch = function(){
+        console.log('> > > > > > appel de .catch sur %o avec les arguments: %o', this, arguments);
+        return originalCatch.apply(this, arguments);
+    };
+
+})(this.Promise);
+
+
+
+// On appelle catch sur une promesse déjà résolue
+Promise.resolve().catch(function XXX(){});
+
+// Dans la console, on aura :
+// > > > > > > appel de .catch sur Promise{} avec les arguments: Arguments{1} [0: function XXX()]
+// > > > > > > appel de .then sur Promise{} avec les arguments: Arguments{2} [0: undefined, 1: function XXX()]
+
+ +

Spécifications

+ + + + + + + + + + + + + + + + + + + + + +
SpécificationÉtatCommentaires
{{SpecName('ES2015', '#sec-promise.prototype.catch', 'Promise.prototype.catch')}}{{Spec2('ES2015')}}Définition initiale au sein d'un standard ECMA.
{{SpecName('ESDraft', '#sec-promise.prototype.catch', 'Promise.prototype.catch')}}{{Spec2('ESDraft')}}
+ +

Compatibilité des navigateurs

+ +

{{Compat("javascript.builtins.Promise.catch")}}

+ +

Voir aussi

+ + diff --git a/files/fr/web/javascript/reference/global_objects/promise/finally/index.html b/files/fr/web/javascript/reference/global_objects/promise/finally/index.html deleted file mode 100644 index 36892e1148..0000000000 --- a/files/fr/web/javascript/reference/global_objects/promise/finally/index.html +++ /dev/null @@ -1,105 +0,0 @@ ---- -title: Promise.prototype.finally() -slug: Web/JavaScript/Reference/Global_Objects/Promise/finally -tags: - - JavaScript - - Méthode - - Promises - - Reference - - finally -translation_of: Web/JavaScript/Reference/Global_Objects/Promise/finally -original_slug: Web/JavaScript/Reference/Objets_globaux/Promise/finally ---- -
{{JSRef}}
- -

La méthode finally() renvoie un objet Promise et accepte en argument une fonction de callback qui est appelée lorsque la promesse a été résolue (qu'elle ait été tenue ou rejetée). Cela permet d'exécuter du code une fois que la promesse a été traitée, quel que soit le résultat. On évite ainsi de dupliquer du code entre les gestionnaires {{jsxref("Promise.then", "then()")}} et {{jsxref("Promise.catch", "catch()")}}.

- -

Syntaxe

- -
p.finally(onFinally);
-
-p.finally(function() {
-   // appelée dans tous les
-   // cas de terminaison
-});
-
- -

Paramètres

- -
-
onFinally
-
Une fonction (objet {{jsxref("Function")}}) appelé lorsque la promesse courante est résolue.
-
- -

Valeur de retour

- -

Cette méthode renvoie un objet {{jsxref("Promise")}}.

- -

Description

- -

La méthode finally peut être utile si on souhaite effectuer un traitement ou du nettoyage (fermetures de flux, libération de ressources, etc.) une fois qu'une promesse est résolue, quel que soit l'état de la résolution (tenue ou rejetée).

- -

La méthode finally est similaire à l'utilisation de la forme .then(onFinally, onFinally), on notera toutefois quelques différences :

- - - -
-

Note : Toutefois, on notera qu'utiliser throw (ou que renvoyer une promesse rompue) dans le callback finally rejettera la promesse avec l'exception indiquée dans l'appel à throw.

-
- -

Exemples

- -
let isLoading = true;
-
-fetch(myRequest).then(function(response) {
-    var contentType = response.headers.get("content-type");
-    if(contentType && contentType.includes("application/json")) {
-      return response.json();
-    }
-    throw new TypeError("Oups, ceci n'est pas du JSON !");
-  })
-  .then(function(json) { /* traiter le JSON */ })
-  .catch(function(error) { console.log(error);
-       /* La ligne précédent peut aussi déclencher une
-          erreur (si console vaut {} par exemple) */
-   })
-  .finally(function() { isLoading = false; });
-
-
- -

Spécifications

- - - - - - - - - - - - - - -
SpécificationÉtatCommentaires
{{SpecName('ESDraft', '#sec-promise.prototype.finally', 'Promise.prototype.finally')}}{{Spec2('ESDraft')}}
- -

Compatibilité des navigateurs

- -

{{Compat("javascript.builtins.Promise.finally")}}

- -

Voir aussi

- - diff --git a/files/fr/web/javascript/reference/global_objects/promise/finally/index.md b/files/fr/web/javascript/reference/global_objects/promise/finally/index.md new file mode 100644 index 0000000000..36892e1148 --- /dev/null +++ b/files/fr/web/javascript/reference/global_objects/promise/finally/index.md @@ -0,0 +1,105 @@ +--- +title: Promise.prototype.finally() +slug: Web/JavaScript/Reference/Global_Objects/Promise/finally +tags: + - JavaScript + - Méthode + - Promises + - Reference + - finally +translation_of: Web/JavaScript/Reference/Global_Objects/Promise/finally +original_slug: Web/JavaScript/Reference/Objets_globaux/Promise/finally +--- +
{{JSRef}}
+ +

La méthode finally() renvoie un objet Promise et accepte en argument une fonction de callback qui est appelée lorsque la promesse a été résolue (qu'elle ait été tenue ou rejetée). Cela permet d'exécuter du code une fois que la promesse a été traitée, quel que soit le résultat. On évite ainsi de dupliquer du code entre les gestionnaires {{jsxref("Promise.then", "then()")}} et {{jsxref("Promise.catch", "catch()")}}.

+ +

Syntaxe

+ +
p.finally(onFinally);
+
+p.finally(function() {
+   // appelée dans tous les
+   // cas de terminaison
+});
+
+ +

Paramètres

+ +
+
onFinally
+
Une fonction (objet {{jsxref("Function")}}) appelé lorsque la promesse courante est résolue.
+
+ +

Valeur de retour

+ +

Cette méthode renvoie un objet {{jsxref("Promise")}}.

+ +

Description

+ +

La méthode finally peut être utile si on souhaite effectuer un traitement ou du nettoyage (fermetures de flux, libération de ressources, etc.) une fois qu'une promesse est résolue, quel que soit l'état de la résolution (tenue ou rejetée).

+ +

La méthode finally est similaire à l'utilisation de la forme .then(onFinally, onFinally), on notera toutefois quelques différences :

+ + + +
+

Note : Toutefois, on notera qu'utiliser throw (ou que renvoyer une promesse rompue) dans le callback finally rejettera la promesse avec l'exception indiquée dans l'appel à throw.

+
+ +

Exemples

+ +
let isLoading = true;
+
+fetch(myRequest).then(function(response) {
+    var contentType = response.headers.get("content-type");
+    if(contentType && contentType.includes("application/json")) {
+      return response.json();
+    }
+    throw new TypeError("Oups, ceci n'est pas du JSON !");
+  })
+  .then(function(json) { /* traiter le JSON */ })
+  .catch(function(error) { console.log(error);
+       /* La ligne précédent peut aussi déclencher une
+          erreur (si console vaut {} par exemple) */
+   })
+  .finally(function() { isLoading = false; });
+
+
+ +

Spécifications

+ + + + + + + + + + + + + + +
SpécificationÉtatCommentaires
{{SpecName('ESDraft', '#sec-promise.prototype.finally', 'Promise.prototype.finally')}}{{Spec2('ESDraft')}}
+ +

Compatibilité des navigateurs

+ +

{{Compat("javascript.builtins.Promise.finally")}}

+ +

Voir aussi

+ + diff --git a/files/fr/web/javascript/reference/global_objects/promise/index.html b/files/fr/web/javascript/reference/global_objects/promise/index.html deleted file mode 100644 index 2399e3eebd..0000000000 --- a/files/fr/web/javascript/reference/global_objects/promise/index.html +++ /dev/null @@ -1,234 +0,0 @@ ---- -title: Promise -slug: Web/JavaScript/Reference/Global_Objects/Promise -tags: - - ECMAScript 2015 - - JavaScript - - Promise - - Reference -translation_of: Web/JavaScript/Reference/Global_Objects/Promise -original_slug: Web/JavaScript/Reference/Objets_globaux/Promise ---- -
{{JSRef}}
- -

L'objet Promise (pour « promesse ») est utilisé pour réaliser des traitements de façon asynchrone. Une promesse représente une valeur qui peut être disponible maintenant, dans le futur voire jamais.

- -
-

Note : Cet article décrit le constructeur Promise. Pour en savoir plus sur les promesses en général, nous vous conseillons de lire l'article Utiliser les promesses. Le constructeur Promise est principalement utilisé pour envelopper des fonctions qui ne prennent pas en charge les promesses.

-
- -
{{EmbedInteractiveExample("pages/js/promise-constructor.html")}}
- -

Syntaxe

- -
new Promise( /* exécuteur */ function(resolve, reject) { ... } );
- -

Paramètres

- -
-
exécuteur
-
Une fonction à laquelle on passera deux arguments : resolve et reject. Cette fonction est exécutée immédiatement par l'implémentation de Promise qui fournit les fonctions resolve et reject (elle est exécutée avant que le constructeur Promise ait renvoyé l'objet créé). Les fonctions resolve et reject, lorsqu'elles sont appelées, permettent respectivement de tenir ou de rompre la promesse. On attend de l'exécuteur qu'il démarre un travail asynchrone puis, une fois le travail terminé, appelle la fonction resolve (si tout s'est bien passé) ou la fonction reject (lorsqu'il y a eu un problème) pour définir l'état final de la promesse.
- Si une erreur est générée par l'exécuteur, la promesse est rompue et la valeur de retour de l'exécuteur est ignorée.
-
- -

Description

- -

L'interface Promise représente un intermédiaire (proxy) vers une valeur qui n'est pas nécessairement connue au moment de sa création. Cela permet d'associer des gestionnaires au succès éventuel d'une action asynchrone et à la raison d'une erreur. Ainsi, des méthodes asynchrones renvoient des valeurs comme les méthodes synchrones, la seule différence est que la valeur retournée par la méthode asynchrone est une promesse (d'avoir une valeur plus tard).

- -

Une Promise est dans un de ces états :

- - - -

Une promesse en attente peut être tenue avec une valeur ou rompue avec une raison (erreur). Quand on arrive à l'une des deux situations, les gestionnaires associés lors de l'appel de la méthode then sont alors appelés. (Si la promesse a déjà été tenue ou rompue lorsque le gestionnaire est attaché à la promesse, le gestionnaire est appelé. Cela permet qu'il n'y ait pas de situation de compétition entre une opération asynchrone en cours et les gestionnaires ajoutés).

- -

Les méthodes {{jsxref("Promise.then","Promise.prototype.then()")}} et {{jsxref("Promise.catch","Promise.prototype.catch()")}} renvoient des promesses et peuvent ainsi être chaînées. C'est ce qu'on appelle une composition.

- -

- -
-

Note : Une promesse est dans l'état settled (acquittée) qu'elle soit tenue ou rompue mais plus en attente. Le terme resolved (résolue) est aussi utilisé concernant les promesses — cela signifie que la promesse est acquittée ou bien enfermée dans une chaine de promesse. Le billet de Domenic Denicola, States and fates (en anglais), contient de plus amples détails sur la terminologie utilisée.

-
- -
-

Attention : D'autres langages utilisent des mécanismes d'évaluation à la volée (lazy evaluation) et de déport des calculs (deferring computations). Ces mécanismes sont également intitulés promesses (promises). En JavaScript, les promesses correspondent à des processus déjà lancés et qui peuvent être chaînés avec des fonctions de retour. Si vous cherchez à retarder l'évaluation, vous pouvez utiliser les fonctions fléchées sans arguments (ex. f = () => expression) afin de créer une expression à évaluer plus tard et utiliser f() pour l'évaluer au moment voulu.

-
- -

Propriétés

- -
-
Promise.length
-
Une propriété de longueur qui vaut 1 (le nombre d'arguments pour le constructeur).
-
{{jsxref("Promise.prototype")}}
-
Cette propriété représente le prototype du constructeur Promise.
-
- -

Méthodes

- -
-
{{jsxref("Promise.all", "Promise.all(iterable)")}}
-
Renvoie une promesse tenue lorsque toutes les promesses de l'argument itérable sont tenues ou une promesse rompue dès qu'une promesse de l'argument itérable est rompue. Si la promesse est tenue, elle est résolue avec un tableau contenant les valeurs de résolution des différentes promesses contenues dans l'itérable (dans le même ordre que celui-ci). Si la promesse est rompue, elle contient la raison de la rupture de la part de la promesse en cause, contenue dans l'itérable. Cette méthode est utile pour agréger les résultats de plusieurs promesses tous ensemble.
-
{{jsxref("Promise.allSettled", "Promise.allSettled(iterable)")}}
-
Attend que l'ensemble des promesses aient été acquittées (tenues ou rompues) et renvoie une promesse qui est résolue après que chaque promesse ait été tenue ou rompue. La valeur de résolution de la promesse renvoyée est un tableau dont chaque élément est le résultat des promesses initiales.
-
{{jsxref("Promise.race", "Promise.race(iterable)")}}
-
Renvoie une promesse qui est tenue ou rompue dès que l'une des promesses de l'itérable est tenue ou rompue avec la valeur ou la raison correspondante.
-
{{jsxref("Promise.reject", "Promise.reject(raison)")}}
-
Renvoie un objet Promise qui est rompue avec la raison donnée.
-
{{jsxref("Promise.resolve", "Promise.resolve(valeur)")}}
-
Renvoie un objet Promise qui est tenue (résolue) avec la valeur donnée. Si la valeur possède une méthode then, la promesse renvoyée « suivra » cette méthode pour arriver dans son état, sinon la promesse renvoyée sera tenue avec la valeur fournie. Généralement, quand on veut savoir si une valeur est une promesse, on utilisera {{jsxref("Promise.resolve","Promise.resolve(valeur)")}} et on travaillera avec la valeur de retour en tant que promesse.
-
- -

Prototype pour Promise

- -

Propriétés

- -

{{page('fr/docs/Web/JavaScript/Reference/Objets_globaux/Promise/prototype','Propriétés')}}

- -

Méthodes

- -

{{page('fr/docs/Web/JavaScript/Reference/Objets_globaux/Promise/prototype','Méthodes')}}

- -

Exemples

- -

Créer une promesse

- -

Pour créer une promesse, on utilise l'opérateur new et le constructeur. Celui-ci prend en argument une fonction qui prend deux fonctions en paramètres. La première est appelée quand la tâche asynchrone est correctement terminée et la seconde est appelée quand la tâche échoue :

- -
const maPremierePromesse = new Promise((resolve, reject) => {
-  // réaliser une tâche asynchrone et appeler :
-
-  // resolve(uneValeur); // si la promesse est tenue
-  // ou
-  // reject("raison d'echec"); // si elle est rompue
-});
-
- -

On peut ainsi obtenir des fonctions asynchrones en renvoyant une promesse :

- -
function maFonctionAsynchrone(url) {
-  return new Promise((resolve, reject) => {
-    const xhr = new XMLHttpRequest();
-    xhr.open("GET", url);
-    xhr.onload = () => resolve(xhr.responseText);
-    xhr.onerror = () => reject(xhr.statusText);
-    xhr.send();
-  });
-}
- -

Exemple interactif

- -
<button id="btn" type="button">Créer un objet Promise !</button>
-<div id="log"></div>
-
- -

Dans le court exemple qui suit, on illustre le mécanisme d'une Promise. La méthode testPromise() est appelée chaque fois qu'on clique sur l'élément {{HTMLElement("button")}}. Cette méthode crée une promesse qui sera tenue grâce à la fonction {{domxref("window.setTimeout()")}}, et avec la valeur comptePromesse (nombre commançant à 1) après 1s à 3s (aléatoire). Le constructeur Promise() est utilisé pour créer la promesse.

- -

Le fait que la promesse soit tenue est simplement enregistré via un callback sur p1.then(). Quelques indicateurs illustrent la manière dont la partie synchrone est découplée de la partie asynchrone.

- -
'use strict';
-var comptePromesse = 0;
-
-function testPromise() {
-  var thisComptePromesse = ++comptePromesse;
-
-  var log = document.getElementById('log');
-  log.insertAdjacentHTML('beforeend', thisComptePromesse +
-      ') Started (<small>Début du code synchrone</small>)<br/>');
-
-  // on crée une nouvelle promesse :
-  var p1 = new Promise(
-    // La fonction de résolution est appelée avec la capacité de
-    // tenir ou de rompre la promesse
-    function(resolve, reject) {
-      log.insertAdjacentHTML('beforeend', thisComptePromesse +
-          ') Promise started (<small>Début du code asynchrone</small>)<br/>');
-
-      // Voici un exemple simple pour créer un code asynchrone
-      window.setTimeout(
-        function() {
-          // On tient la promesse !
-          resolve(thisComptePromesse);
-        }, Math.random() * 2000 + 1000);
-    });
-
-  // On définit ce qui se passe quand la promesse est tenue
-  // et ce qu'on appelle (uniquement) dans ce cas
-  // La méthode catch() définit le traitement à effectuer
-  // quand la promesse est rompue.
-  p1.then(
-    // On affiche un message avec la valeur
-    function(val) {
-      log.insertAdjacentHTML('beforeend', val +
-          ') Promise fulfilled (<small>Fin du code asynchrone</small>)<br/>');
-    }).catch(
-      // Promesse rejetée
-      function() {
-        console.log("promesse rompue");
-      });
-
-  log.insertAdjacentHTML('beforeend', thisComptePromesse +
-      ') Promise made (<small>Fin du code synchrone</small>)<br/>');
-}
-
- -
if ("Promise" in window) {
-  var btn = document.getElementById("btn");
-  btn.addEventListener("click", testPromise);
- } else {
-  log = document.getElementById('log');
-  log.innerHTML = "L'exemple live n'est pas disponible pour votre navigateur car celui-ci ne supporte pas l'interface <code>Promise<code>.";
-}
- -

L'exemple s'exécute lorsqu'on clique sur le bouton. Pour tester cet exemple, il est nécessaire d'utiliser un navigateur qui supporte les objets Promise. En cliquant plusieurs fois sur le bouton en peu de temps, on verra qu'il y a plusieurs promesses tenues les une après les autres.

- -

{{EmbedLiveSample('Exemple_interactif', '500', '200')}}

- -

Charger une image en XHR

- -

Un autre exemple simple utilisant Promise et {{domxref("XMLHttpRequest")}} afin de charger une image est disponible sur le dépôt GitHub MDN js-examples. Vous pouvez également voir le résultat. Chaque étape est commentée afin de vous permettre de suivre l'état de la promesse et l'architecture utilisée avec XHR.

- -

Spécifications

- - - - - - - - - - - - - - - - - - - -
SpécificationÉtatCommentaires
{{SpecName('ES2015', '#sec-promise-objects', 'Promise')}}{{Spec2('ES2015')}}Définition initiale au sein d'un standard ECMA.
{{SpecName('ESDraft', '#sec-promise-objects', 'Promise')}}{{Spec2('ESDraft')}}
- -

Compatibilité des navigateurs

- -

{{Compat("javascript.builtins.Promise")}}

- -

Voir aussi

- - diff --git a/files/fr/web/javascript/reference/global_objects/promise/index.md b/files/fr/web/javascript/reference/global_objects/promise/index.md new file mode 100644 index 0000000000..2399e3eebd --- /dev/null +++ b/files/fr/web/javascript/reference/global_objects/promise/index.md @@ -0,0 +1,234 @@ +--- +title: Promise +slug: Web/JavaScript/Reference/Global_Objects/Promise +tags: + - ECMAScript 2015 + - JavaScript + - Promise + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Promise +original_slug: Web/JavaScript/Reference/Objets_globaux/Promise +--- +
{{JSRef}}
+ +

L'objet Promise (pour « promesse ») est utilisé pour réaliser des traitements de façon asynchrone. Une promesse représente une valeur qui peut être disponible maintenant, dans le futur voire jamais.

+ +
+

Note : Cet article décrit le constructeur Promise. Pour en savoir plus sur les promesses en général, nous vous conseillons de lire l'article Utiliser les promesses. Le constructeur Promise est principalement utilisé pour envelopper des fonctions qui ne prennent pas en charge les promesses.

+
+ +
{{EmbedInteractiveExample("pages/js/promise-constructor.html")}}
+ +

Syntaxe

+ +
new Promise( /* exécuteur */ function(resolve, reject) { ... } );
+ +

Paramètres

+ +
+
exécuteur
+
Une fonction à laquelle on passera deux arguments : resolve et reject. Cette fonction est exécutée immédiatement par l'implémentation de Promise qui fournit les fonctions resolve et reject (elle est exécutée avant que le constructeur Promise ait renvoyé l'objet créé). Les fonctions resolve et reject, lorsqu'elles sont appelées, permettent respectivement de tenir ou de rompre la promesse. On attend de l'exécuteur qu'il démarre un travail asynchrone puis, une fois le travail terminé, appelle la fonction resolve (si tout s'est bien passé) ou la fonction reject (lorsqu'il y a eu un problème) pour définir l'état final de la promesse.
+ Si une erreur est générée par l'exécuteur, la promesse est rompue et la valeur de retour de l'exécuteur est ignorée.
+
+ +

Description

+ +

L'interface Promise représente un intermédiaire (proxy) vers une valeur qui n'est pas nécessairement connue au moment de sa création. Cela permet d'associer des gestionnaires au succès éventuel d'une action asynchrone et à la raison d'une erreur. Ainsi, des méthodes asynchrones renvoient des valeurs comme les méthodes synchrones, la seule différence est que la valeur retournée par la méthode asynchrone est une promesse (d'avoir une valeur plus tard).

+ +

Une Promise est dans un de ces états :

+ + + +

Une promesse en attente peut être tenue avec une valeur ou rompue avec une raison (erreur). Quand on arrive à l'une des deux situations, les gestionnaires associés lors de l'appel de la méthode then sont alors appelés. (Si la promesse a déjà été tenue ou rompue lorsque le gestionnaire est attaché à la promesse, le gestionnaire est appelé. Cela permet qu'il n'y ait pas de situation de compétition entre une opération asynchrone en cours et les gestionnaires ajoutés).

+ +

Les méthodes {{jsxref("Promise.then","Promise.prototype.then()")}} et {{jsxref("Promise.catch","Promise.prototype.catch()")}} renvoient des promesses et peuvent ainsi être chaînées. C'est ce qu'on appelle une composition.

+ +

+ +
+

Note : Une promesse est dans l'état settled (acquittée) qu'elle soit tenue ou rompue mais plus en attente. Le terme resolved (résolue) est aussi utilisé concernant les promesses — cela signifie que la promesse est acquittée ou bien enfermée dans une chaine de promesse. Le billet de Domenic Denicola, States and fates (en anglais), contient de plus amples détails sur la terminologie utilisée.

+
+ +
+

Attention : D'autres langages utilisent des mécanismes d'évaluation à la volée (lazy evaluation) et de déport des calculs (deferring computations). Ces mécanismes sont également intitulés promesses (promises). En JavaScript, les promesses correspondent à des processus déjà lancés et qui peuvent être chaînés avec des fonctions de retour. Si vous cherchez à retarder l'évaluation, vous pouvez utiliser les fonctions fléchées sans arguments (ex. f = () => expression) afin de créer une expression à évaluer plus tard et utiliser f() pour l'évaluer au moment voulu.

+
+ +

Propriétés

+ +
+
Promise.length
+
Une propriété de longueur qui vaut 1 (le nombre d'arguments pour le constructeur).
+
{{jsxref("Promise.prototype")}}
+
Cette propriété représente le prototype du constructeur Promise.
+
+ +

Méthodes

+ +
+
{{jsxref("Promise.all", "Promise.all(iterable)")}}
+
Renvoie une promesse tenue lorsque toutes les promesses de l'argument itérable sont tenues ou une promesse rompue dès qu'une promesse de l'argument itérable est rompue. Si la promesse est tenue, elle est résolue avec un tableau contenant les valeurs de résolution des différentes promesses contenues dans l'itérable (dans le même ordre que celui-ci). Si la promesse est rompue, elle contient la raison de la rupture de la part de la promesse en cause, contenue dans l'itérable. Cette méthode est utile pour agréger les résultats de plusieurs promesses tous ensemble.
+
{{jsxref("Promise.allSettled", "Promise.allSettled(iterable)")}}
+
Attend que l'ensemble des promesses aient été acquittées (tenues ou rompues) et renvoie une promesse qui est résolue après que chaque promesse ait été tenue ou rompue. La valeur de résolution de la promesse renvoyée est un tableau dont chaque élément est le résultat des promesses initiales.
+
{{jsxref("Promise.race", "Promise.race(iterable)")}}
+
Renvoie une promesse qui est tenue ou rompue dès que l'une des promesses de l'itérable est tenue ou rompue avec la valeur ou la raison correspondante.
+
{{jsxref("Promise.reject", "Promise.reject(raison)")}}
+
Renvoie un objet Promise qui est rompue avec la raison donnée.
+
{{jsxref("Promise.resolve", "Promise.resolve(valeur)")}}
+
Renvoie un objet Promise qui est tenue (résolue) avec la valeur donnée. Si la valeur possède une méthode then, la promesse renvoyée « suivra » cette méthode pour arriver dans son état, sinon la promesse renvoyée sera tenue avec la valeur fournie. Généralement, quand on veut savoir si une valeur est une promesse, on utilisera {{jsxref("Promise.resolve","Promise.resolve(valeur)")}} et on travaillera avec la valeur de retour en tant que promesse.
+
+ +

Prototype pour Promise

+ +

Propriétés

+ +

{{page('fr/docs/Web/JavaScript/Reference/Objets_globaux/Promise/prototype','Propriétés')}}

+ +

Méthodes

+ +

{{page('fr/docs/Web/JavaScript/Reference/Objets_globaux/Promise/prototype','Méthodes')}}

+ +

Exemples

+ +

Créer une promesse

+ +

Pour créer une promesse, on utilise l'opérateur new et le constructeur. Celui-ci prend en argument une fonction qui prend deux fonctions en paramètres. La première est appelée quand la tâche asynchrone est correctement terminée et la seconde est appelée quand la tâche échoue :

+ +
const maPremierePromesse = new Promise((resolve, reject) => {
+  // réaliser une tâche asynchrone et appeler :
+
+  // resolve(uneValeur); // si la promesse est tenue
+  // ou
+  // reject("raison d'echec"); // si elle est rompue
+});
+
+ +

On peut ainsi obtenir des fonctions asynchrones en renvoyant une promesse :

+ +
function maFonctionAsynchrone(url) {
+  return new Promise((resolve, reject) => {
+    const xhr = new XMLHttpRequest();
+    xhr.open("GET", url);
+    xhr.onload = () => resolve(xhr.responseText);
+    xhr.onerror = () => reject(xhr.statusText);
+    xhr.send();
+  });
+}
+ +

Exemple interactif

+ +
<button id="btn" type="button">Créer un objet Promise !</button>
+<div id="log"></div>
+
+ +

Dans le court exemple qui suit, on illustre le mécanisme d'une Promise. La méthode testPromise() est appelée chaque fois qu'on clique sur l'élément {{HTMLElement("button")}}. Cette méthode crée une promesse qui sera tenue grâce à la fonction {{domxref("window.setTimeout()")}}, et avec la valeur comptePromesse (nombre commançant à 1) après 1s à 3s (aléatoire). Le constructeur Promise() est utilisé pour créer la promesse.

+ +

Le fait que la promesse soit tenue est simplement enregistré via un callback sur p1.then(). Quelques indicateurs illustrent la manière dont la partie synchrone est découplée de la partie asynchrone.

+ +
'use strict';
+var comptePromesse = 0;
+
+function testPromise() {
+  var thisComptePromesse = ++comptePromesse;
+
+  var log = document.getElementById('log');
+  log.insertAdjacentHTML('beforeend', thisComptePromesse +
+      ') Started (<small>Début du code synchrone</small>)<br/>');
+
+  // on crée une nouvelle promesse :
+  var p1 = new Promise(
+    // La fonction de résolution est appelée avec la capacité de
+    // tenir ou de rompre la promesse
+    function(resolve, reject) {
+      log.insertAdjacentHTML('beforeend', thisComptePromesse +
+          ') Promise started (<small>Début du code asynchrone</small>)<br/>');
+
+      // Voici un exemple simple pour créer un code asynchrone
+      window.setTimeout(
+        function() {
+          // On tient la promesse !
+          resolve(thisComptePromesse);
+        }, Math.random() * 2000 + 1000);
+    });
+
+  // On définit ce qui se passe quand la promesse est tenue
+  // et ce qu'on appelle (uniquement) dans ce cas
+  // La méthode catch() définit le traitement à effectuer
+  // quand la promesse est rompue.
+  p1.then(
+    // On affiche un message avec la valeur
+    function(val) {
+      log.insertAdjacentHTML('beforeend', val +
+          ') Promise fulfilled (<small>Fin du code asynchrone</small>)<br/>');
+    }).catch(
+      // Promesse rejetée
+      function() {
+        console.log("promesse rompue");
+      });
+
+  log.insertAdjacentHTML('beforeend', thisComptePromesse +
+      ') Promise made (<small>Fin du code synchrone</small>)<br/>');
+}
+
+ +
if ("Promise" in window) {
+  var btn = document.getElementById("btn");
+  btn.addEventListener("click", testPromise);
+ } else {
+  log = document.getElementById('log');
+  log.innerHTML = "L'exemple live n'est pas disponible pour votre navigateur car celui-ci ne supporte pas l'interface <code>Promise<code>.";
+}
+ +

L'exemple s'exécute lorsqu'on clique sur le bouton. Pour tester cet exemple, il est nécessaire d'utiliser un navigateur qui supporte les objets Promise. En cliquant plusieurs fois sur le bouton en peu de temps, on verra qu'il y a plusieurs promesses tenues les une après les autres.

+ +

{{EmbedLiveSample('Exemple_interactif', '500', '200')}}

+ +

Charger une image en XHR

+ +

Un autre exemple simple utilisant Promise et {{domxref("XMLHttpRequest")}} afin de charger une image est disponible sur le dépôt GitHub MDN js-examples. Vous pouvez également voir le résultat. Chaque étape est commentée afin de vous permettre de suivre l'état de la promesse et l'architecture utilisée avec XHR.

+ +

Spécifications

+ + + + + + + + + + + + + + + + + + + +
SpécificationÉtatCommentaires
{{SpecName('ES2015', '#sec-promise-objects', 'Promise')}}{{Spec2('ES2015')}}Définition initiale au sein d'un standard ECMA.
{{SpecName('ESDraft', '#sec-promise-objects', 'Promise')}}{{Spec2('ESDraft')}}
+ +

Compatibilité des navigateurs

+ +

{{Compat("javascript.builtins.Promise")}}

+ +

Voir aussi

+ + diff --git a/files/fr/web/javascript/reference/global_objects/promise/race/index.html b/files/fr/web/javascript/reference/global_objects/promise/race/index.html deleted file mode 100644 index ddb0475694..0000000000 --- a/files/fr/web/javascript/reference/global_objects/promise/race/index.html +++ /dev/null @@ -1,188 +0,0 @@ ---- -title: Promise.race() -slug: Web/JavaScript/Reference/Global_Objects/Promise/race -tags: - - ECMAScript 2015 - - JavaScript - - Méthode - - Promise - - Reference -translation_of: Web/JavaScript/Reference/Global_Objects/Promise/race -original_slug: Web/JavaScript/Reference/Objets_globaux/Promise/race ---- -
{{JSRef}}
- -

La méthode Promise.race() renvoie une promesse qui est résolue ou rejetée dès qu'une des promesses de l'itérable passé en argument est résolue ou rejetée. La valeur (dans le cas de la résolution) ou la raison (dans le cas d'un échec) utilisée est celle de la promesse de l'itérable qui est resolue/qui échoue.

- -
{{EmbedInteractiveExample("pages/js/promise-race.html")}}
- -

Syntaxe

- -
Promise.race(itérable);
- -

Paramètres

- -
-
itérable
-
Un objet itérable, par exemple un {{jsxref("Array")}}. Voir la page itérable.
-
- -

Valeur de retour

- -

Une promesse ({{jsxref("Promise")}}) à résoudre qui est résolue de façon asynchrone dès que l'une des promesses de l'itérable est tenue ou rompue.

- -

Description

- -

La fonction race renvoie une Promise qui est résolue/rejetée de la même façon que la première promesse de l'itérable à être résolue/rejetée.

- -

Si l'itérable passé en argument est vide, la promesse sera continuellement en attente.

- -

Si l'itérable contient une ou plusieurs valeurs qui ne sont pas des promesses ou une promesse déjà résolue, Promise.race fournira une promesse résolue avec la première de ces valeurs trouvées dans l'itérable.

- -

Exemples

- -

Caractère asynchrone de Promise.race()

- -

L'exemple qui suit illuste le caractère asynchrone de Promise.race:

- -
// On passe un tableau de promesses déjà résolues
-// en argument afin de déclencher Promise.race
-// dès que possible
-var resolvedPromisesArray = [Promise.resolve(33), Promise.resolve(44)];
-
-var p = Promise.race(resolvedPromisesArray);
-// On affiche immédiatement la valeur p dans la console
-console.log(p);
-
-// Avec setTimeout on peut exécuter du code
-// une fois que la pile est vide
-setTimeout(function(){
-    console.log('La pile est désormais vide');
-    console.log(p);
-});
-
-// affichera, dans cet ordre :
-// Promise { <state>: "pending" }
-// La pile est désormais vide
-// Promise { <state>: "fulfilled", <value>: 33 }
- -

Un itérable vide renverra une promesse qui restera en attente :

- -
var foreverPendingPromise = Promise.race([]);
-console.log(foreverPendingPromise);
-setTimeout(function(){
-    console.log('La pile est désormais vide');
-    console.log(foreverPendingPromise);
-});
-
-// affichera, dans cet ordre :
-// Promise { <state>: "pending" }
-// La pile est désormais vide
-// Promise { <state>: "pending" }
-
- -

Si l'itérable contient une ou plusieurs valeurs qui ne sont pas des promesses ou des promesses déjà résolues, Promise.race considèrera la première valeur ainsi trouvée dans l'itérable :

- -
var foreverPendingPromise = Promise.race([]);
-var alreadyResolvedProm = Promise.resolve(666);
-
-var arr = [foreverPendingPromise, alreadyResolvedProm, "non-Promise value"];
-var arr2 = [foreverPendingPromise, "non-Promise value", Promise.resolve(666)];
-var p = Promise.race(arr);
-var p2 = Promise.race(arr2);
-
-console.log(p);
-console.log(p2);
-setTimeout(function(){
-    console.log('the stack is now empty');
-    console.log(p);
-    console.log(p2);
-});
-
-// affichera dans l'ordre :
-// Promise { <state>: "pending" }
-// Promise { <state>: "pending" }
-// the stack is now empty
-// Promise { <state>: "fulfilled", <value>: 666 }
-// Promise { <state>: "fulfilled", <value>: "non-Promise value" }
-
- -

Utilisation de Promise.race – exemples avec setTimeout

- -
var p1 = new Promise(function(resolve, reject) {
-    setTimeout(resolve, 500, "un");
-});
-var p2 = new Promise(function(resolve, reject) {
-    setTimeout(resolve, 100, "deux");
-});
-
-Promise.race([p1, p2]).then(function(value) {
-  console.log(value); // "deux"
-  // Les deux promesses sont résolues mais p2 est plus rapide
-});
-
-var p3 = new Promise(function(resolve, reject) {
-    setTimeout(resolve, 100, "trois");
-});
-var p4 = new Promise(function(resolve, reject) {
-    setTimeout(reject, 500, "quatre");
-});
-
-Promise.race([p3, p4]).then(function(value) {
-  console.log(value); // "trois"
-  // p3 est plus rapide et entraîne la résolution de la promesse de compétition
-}, function(reason) {
-  // N'est pas appelée
-});
-
-var p5 = new Promise(function(resolve, reject) {
-    setTimeout(resolve, 500, "cinq");
-});
-var p6 = new Promise(function(resolve, reject) {
-    setTimeout(reject, 100, "six");
-});
-
-Promise.race([p5, p6]).then(function(value) {
-  // N'est pas appelée
-}, function(reason) {
-  console.log(reason); // "six"
-  // p6 est plus rapide et rejète la promesse de compétition
-});
-
- -
-

Note : voir la documentation sur setTimeout.

-
- -

Spécifications

- - - - - - - - - - - - - - - - - - - -
SpécificationÉtatCommentaires
{{SpecName('ES2015', '#sec-promise.race', 'Promise.race')}}{{Spec2('ES2015')}}Définition initiale au sein d'un standard ECMA.
{{SpecName('ESDraft', '#sec-promise.race', 'Promise.race')}}{{Spec2('ESDraft')}}
- -

Compatibilité des navigateurs

- -

{{Compat("javascript.builtins.Promise.race")}}

- -

Voir aussi

- - diff --git a/files/fr/web/javascript/reference/global_objects/promise/race/index.md b/files/fr/web/javascript/reference/global_objects/promise/race/index.md new file mode 100644 index 0000000000..ddb0475694 --- /dev/null +++ b/files/fr/web/javascript/reference/global_objects/promise/race/index.md @@ -0,0 +1,188 @@ +--- +title: Promise.race() +slug: Web/JavaScript/Reference/Global_Objects/Promise/race +tags: + - ECMAScript 2015 + - JavaScript + - Méthode + - Promise + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Promise/race +original_slug: Web/JavaScript/Reference/Objets_globaux/Promise/race +--- +
{{JSRef}}
+ +

La méthode Promise.race() renvoie une promesse qui est résolue ou rejetée dès qu'une des promesses de l'itérable passé en argument est résolue ou rejetée. La valeur (dans le cas de la résolution) ou la raison (dans le cas d'un échec) utilisée est celle de la promesse de l'itérable qui est resolue/qui échoue.

+ +
{{EmbedInteractiveExample("pages/js/promise-race.html")}}
+ +

Syntaxe

+ +
Promise.race(itérable);
+ +

Paramètres

+ +
+
itérable
+
Un objet itérable, par exemple un {{jsxref("Array")}}. Voir la page itérable.
+
+ +

Valeur de retour

+ +

Une promesse ({{jsxref("Promise")}}) à résoudre qui est résolue de façon asynchrone dès que l'une des promesses de l'itérable est tenue ou rompue.

+ +

Description

+ +

La fonction race renvoie une Promise qui est résolue/rejetée de la même façon que la première promesse de l'itérable à être résolue/rejetée.

+ +

Si l'itérable passé en argument est vide, la promesse sera continuellement en attente.

+ +

Si l'itérable contient une ou plusieurs valeurs qui ne sont pas des promesses ou une promesse déjà résolue, Promise.race fournira une promesse résolue avec la première de ces valeurs trouvées dans l'itérable.

+ +

Exemples

+ +

Caractère asynchrone de Promise.race()

+ +

L'exemple qui suit illuste le caractère asynchrone de Promise.race:

+ +
// On passe un tableau de promesses déjà résolues
+// en argument afin de déclencher Promise.race
+// dès que possible
+var resolvedPromisesArray = [Promise.resolve(33), Promise.resolve(44)];
+
+var p = Promise.race(resolvedPromisesArray);
+// On affiche immédiatement la valeur p dans la console
+console.log(p);
+
+// Avec setTimeout on peut exécuter du code
+// une fois que la pile est vide
+setTimeout(function(){
+    console.log('La pile est désormais vide');
+    console.log(p);
+});
+
+// affichera, dans cet ordre :
+// Promise { <state>: "pending" }
+// La pile est désormais vide
+// Promise { <state>: "fulfilled", <value>: 33 }
+ +

Un itérable vide renverra une promesse qui restera en attente :

+ +
var foreverPendingPromise = Promise.race([]);
+console.log(foreverPendingPromise);
+setTimeout(function(){
+    console.log('La pile est désormais vide');
+    console.log(foreverPendingPromise);
+});
+
+// affichera, dans cet ordre :
+// Promise { <state>: "pending" }
+// La pile est désormais vide
+// Promise { <state>: "pending" }
+
+ +

Si l'itérable contient une ou plusieurs valeurs qui ne sont pas des promesses ou des promesses déjà résolues, Promise.race considèrera la première valeur ainsi trouvée dans l'itérable :

+ +
var foreverPendingPromise = Promise.race([]);
+var alreadyResolvedProm = Promise.resolve(666);
+
+var arr = [foreverPendingPromise, alreadyResolvedProm, "non-Promise value"];
+var arr2 = [foreverPendingPromise, "non-Promise value", Promise.resolve(666)];
+var p = Promise.race(arr);
+var p2 = Promise.race(arr2);
+
+console.log(p);
+console.log(p2);
+setTimeout(function(){
+    console.log('the stack is now empty');
+    console.log(p);
+    console.log(p2);
+});
+
+// affichera dans l'ordre :
+// Promise { <state>: "pending" }
+// Promise { <state>: "pending" }
+// the stack is now empty
+// Promise { <state>: "fulfilled", <value>: 666 }
+// Promise { <state>: "fulfilled", <value>: "non-Promise value" }
+
+ +

Utilisation de Promise.race – exemples avec setTimeout

+ +
var p1 = new Promise(function(resolve, reject) {
+    setTimeout(resolve, 500, "un");
+});
+var p2 = new Promise(function(resolve, reject) {
+    setTimeout(resolve, 100, "deux");
+});
+
+Promise.race([p1, p2]).then(function(value) {
+  console.log(value); // "deux"
+  // Les deux promesses sont résolues mais p2 est plus rapide
+});
+
+var p3 = new Promise(function(resolve, reject) {
+    setTimeout(resolve, 100, "trois");
+});
+var p4 = new Promise(function(resolve, reject) {
+    setTimeout(reject, 500, "quatre");
+});
+
+Promise.race([p3, p4]).then(function(value) {
+  console.log(value); // "trois"
+  // p3 est plus rapide et entraîne la résolution de la promesse de compétition
+}, function(reason) {
+  // N'est pas appelée
+});
+
+var p5 = new Promise(function(resolve, reject) {
+    setTimeout(resolve, 500, "cinq");
+});
+var p6 = new Promise(function(resolve, reject) {
+    setTimeout(reject, 100, "six");
+});
+
+Promise.race([p5, p6]).then(function(value) {
+  // N'est pas appelée
+}, function(reason) {
+  console.log(reason); // "six"
+  // p6 est plus rapide et rejète la promesse de compétition
+});
+
+ +
+

Note : voir la documentation sur setTimeout.

+
+ +

Spécifications

+ + + + + + + + + + + + + + + + + + + +
SpécificationÉtatCommentaires
{{SpecName('ES2015', '#sec-promise.race', 'Promise.race')}}{{Spec2('ES2015')}}Définition initiale au sein d'un standard ECMA.
{{SpecName('ESDraft', '#sec-promise.race', 'Promise.race')}}{{Spec2('ESDraft')}}
+ +

Compatibilité des navigateurs

+ +

{{Compat("javascript.builtins.Promise.race")}}

+ +

Voir aussi

+ + diff --git a/files/fr/web/javascript/reference/global_objects/promise/reject/index.html b/files/fr/web/javascript/reference/global_objects/promise/reject/index.html deleted file mode 100644 index e8fbfe5b5c..0000000000 --- a/files/fr/web/javascript/reference/global_objects/promise/reject/index.html +++ /dev/null @@ -1,76 +0,0 @@ ---- -title: Promise.reject() -slug: Web/JavaScript/Reference/Global_Objects/Promise/reject -tags: - - ECMAScript 2015 - - JavaScript - - Méthode - - Promise - - Reference -translation_of: Web/JavaScript/Reference/Global_Objects/Promise/reject -original_slug: Web/JavaScript/Reference/Objets_globaux/Promise/reject ---- -
{{JSRef}}
- -

La méthode Promise.reject(raison) renvoie un objet Promise qui est rejeté (la promesse n'est pas tenue) à cause d'une raison donnée.

- -
{{EmbedInteractiveExample("pages/js/promise-reject.html")}}
- -

Syntaxe

- -
Promise.reject(raison);
- -

Paramètres

- -
-
raison
-
La raison pour laquelle la Promise n'a pas été tenue.
-
- -

Valeur de retour

- -

Une promesse ({{jsxref("Promise")}}) qui est rompue avec la raison passée en argument.

- -

Description

- -

La fonction statique Promise.reject renvoie une Promise qui est rejetée. Pour faciliter le débogage (comprendre plus rapidement le problème et sélectionner une erreur précise), il peut être utile que l'argument raison soit une instance d'{{jsxref("Error")}}.

- -

Exemples

- -
Promise.reject(new Error("échec")).then(function() {
-  // n'est pas appelée
-}, function(erreur) {
-  console.log(erreur); // Analyse de la pile d'appels
-});
- -

Spécifications

- - - - - - - - - - - - - - - - - - - -
SpécificationÉtatCommentaires
{{SpecName('ES2015', '#sec-promise.reject', 'Promise.reject')}}{{Spec2('ES2015')}}Définition initiale au sein d'un standard ECMA.
{{SpecName('ESDraft', '#sec-promise.reject', 'Promise.reject')}}{{Spec2('ESDraft')}} 
- -

Compatibilité des navigateurs

- -

{{Compat("javascript.builtins.Promise.reject")}}

- -

Voir aussi

- - diff --git a/files/fr/web/javascript/reference/global_objects/promise/reject/index.md b/files/fr/web/javascript/reference/global_objects/promise/reject/index.md new file mode 100644 index 0000000000..e8fbfe5b5c --- /dev/null +++ b/files/fr/web/javascript/reference/global_objects/promise/reject/index.md @@ -0,0 +1,76 @@ +--- +title: Promise.reject() +slug: Web/JavaScript/Reference/Global_Objects/Promise/reject +tags: + - ECMAScript 2015 + - JavaScript + - Méthode + - Promise + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Promise/reject +original_slug: Web/JavaScript/Reference/Objets_globaux/Promise/reject +--- +
{{JSRef}}
+ +

La méthode Promise.reject(raison) renvoie un objet Promise qui est rejeté (la promesse n'est pas tenue) à cause d'une raison donnée.

+ +
{{EmbedInteractiveExample("pages/js/promise-reject.html")}}
+ +

Syntaxe

+ +
Promise.reject(raison);
+ +

Paramètres

+ +
+
raison
+
La raison pour laquelle la Promise n'a pas été tenue.
+
+ +

Valeur de retour

+ +

Une promesse ({{jsxref("Promise")}}) qui est rompue avec la raison passée en argument.

+ +

Description

+ +

La fonction statique Promise.reject renvoie une Promise qui est rejetée. Pour faciliter le débogage (comprendre plus rapidement le problème et sélectionner une erreur précise), il peut être utile que l'argument raison soit une instance d'{{jsxref("Error")}}.

+ +

Exemples

+ +
Promise.reject(new Error("échec")).then(function() {
+  // n'est pas appelée
+}, function(erreur) {
+  console.log(erreur); // Analyse de la pile d'appels
+});
+ +

Spécifications

+ + + + + + + + + + + + + + + + + + + +
SpécificationÉtatCommentaires
{{SpecName('ES2015', '#sec-promise.reject', 'Promise.reject')}}{{Spec2('ES2015')}}Définition initiale au sein d'un standard ECMA.
{{SpecName('ESDraft', '#sec-promise.reject', 'Promise.reject')}}{{Spec2('ESDraft')}} 
+ +

Compatibilité des navigateurs

+ +

{{Compat("javascript.builtins.Promise.reject")}}

+ +

Voir aussi

+ + diff --git a/files/fr/web/javascript/reference/global_objects/promise/resolve/index.html b/files/fr/web/javascript/reference/global_objects/promise/resolve/index.html deleted file mode 100644 index 7f9e6d1ea9..0000000000 --- a/files/fr/web/javascript/reference/global_objects/promise/resolve/index.html +++ /dev/null @@ -1,153 +0,0 @@ ---- -title: Promise.resolve() -slug: Web/JavaScript/Reference/Global_Objects/Promise/resolve -tags: - - ECMAScript 2015 - - JavaScript - - Méthode - - Promise - - Reference -translation_of: Web/JavaScript/Reference/Global_Objects/Promise/resolve -original_slug: Web/JavaScript/Reference/Objets_globaux/Promise/resolve ---- -
{{JSRef}}
- -

La méthode Promise.resolve(valeur) renvoie un objet {{jsxref("Promise")}} qui est résolu avec la valeur donnée. Si cette valeur est une promesse, la promesse est renvoyée, si la valeur possède une méthode {{jsxref("Promise.then","then")}}, la promesse renvoyée « suivra » cette méthode et prendra son état ; sinon, la promesse renvoyée sera tenue avec la valeur.

- -
{{EmbedInteractiveExample("pages/js/promise-resolve.html")}}
- -
-

Attention : Promise.resolve() ne doit pas être appelée sur un objet thenable qui se résout en lui-même. Cela provoquera une récursion infinie et resolve() tentera d'aplatir ce qui ressemble à une promesse imbriquée à l'infini.

-
- -

Syntaxe

- -
Promise.resolve(valeur);
-Promise.resolve(promesse);
-Promise.resolve(suivant);
-
- -

Paramètres

- -
-
valeur
-
L'argument qu'on souhaite résoudre avec cette promesse (Promise). Cet argument peut être un objet Promise ou un objet avec une méthode then à résoudre à la suite.
-
- -

Valeur de retour

- -

Une promesse ({{jsxref("Promise")}}) qui est résolue avec la valeur indiquée en argument ou la promesse passée en argument si celui-ci est une promesse.

- -

Description

- -

La fonction statique Promise.resolve renvoie un objet Promise qui est résolu.

- -

Exemples

- -

Utilisation de la méthode statique Promise.resolve

- -
Promise.resolve("Succès").then(function(valeur) {
-  console.log(valeur); // "Succès"
-}, function(valeur) {
-  // n'est pas appelée
-});
-
- -

Résoudre un tableau

- -
var p = Promise.resolve([1,2,3]);
-p.then(function(v) {
-  console.log(v[0]); // 1
-});
-
- -

Résoudre une autre Promise

- -
var original = Promise.resolve(33);
-var cast = Promise.resolve(original);
-cast.then(function(value) {
-  console.log("value: " + value);
-});
-console.log("original === cast ? " + (original === cast));
-
-// affiche ceci dans la console (dans cet ordre) :
-// original === cast ? true
-// value: 33
-
- -

L'ordre des traces dans la console est dû au fait que les gestionnaires then() sont appelés de façon asynchrone (plus de détails sur then dans cet article).

- -

Résoudre des objets avec then et renvoyer des erreurs

- -
// Résoudre un objet avec then
-var p1 = Promise.resolve({
-  then: function(onFulfill, onReject) { onFulfill("tenue !"); }
-});
-console.log(p1 instanceof Promise) // true, l'objet est transformée en une Promise
-
-p1.then(function(v) {
-    console.log(v); // "tenue !"
-  }, function(e) {
-    // n'est pas appelée
-});
-
-// L'objet avec then renvoie une erreur avant le callback
-// La promesse n'est pas tenue
-var thenable = { then: function(resolve) {
-  throw new TypeError("Renvoi d'erreur");
-  resolve("Résolution ");
-}};
-
-var p2 = Promise.resolve(thenable);
-p2.then(function(v) {
-  // n'est pas appelée
-}, function(e) {
-  console.log(e); // TypeError : Renvoi d'erreur
-});
-
-// L'objet avec then renvoie une erreur après le callback
-// La promesse est tenue
-var thenable = { then: function(resolve) {
-  resolve("Résolue");
-  throw new TypeError("Erreur");
-}};
-
-var p3 = Promise.resolve(thenable);
-p3.then(function(v) {
-  console.log(v); // "Résolue"
-}, function(e) {
-  // n'est pas appelée
-});
-
- -

Spécifications

- - - - - - - - - - - - - - - - - - - -
SpécificationÉtatCommentaires
{{SpecName('ES2015', '#sec-promise.reject', 'Promise.reject')}}{{Spec2('ES2015')}}Définition initiale au sein d'un standard ECMA.
{{SpecName('ESDraft', '#sec-promise.resolve', 'Promise.resolve')}}{{Spec2('ESDraft')}} 
- -

Compatibilité des navigateurs

- -

{{Compat("javascript.builtins.Promise.resolve")}}

- -

Voir aussi

- - diff --git a/files/fr/web/javascript/reference/global_objects/promise/resolve/index.md b/files/fr/web/javascript/reference/global_objects/promise/resolve/index.md new file mode 100644 index 0000000000..7f9e6d1ea9 --- /dev/null +++ b/files/fr/web/javascript/reference/global_objects/promise/resolve/index.md @@ -0,0 +1,153 @@ +--- +title: Promise.resolve() +slug: Web/JavaScript/Reference/Global_Objects/Promise/resolve +tags: + - ECMAScript 2015 + - JavaScript + - Méthode + - Promise + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Promise/resolve +original_slug: Web/JavaScript/Reference/Objets_globaux/Promise/resolve +--- +
{{JSRef}}
+ +

La méthode Promise.resolve(valeur) renvoie un objet {{jsxref("Promise")}} qui est résolu avec la valeur donnée. Si cette valeur est une promesse, la promesse est renvoyée, si la valeur possède une méthode {{jsxref("Promise.then","then")}}, la promesse renvoyée « suivra » cette méthode et prendra son état ; sinon, la promesse renvoyée sera tenue avec la valeur.

+ +
{{EmbedInteractiveExample("pages/js/promise-resolve.html")}}
+ +
+

Attention : Promise.resolve() ne doit pas être appelée sur un objet thenable qui se résout en lui-même. Cela provoquera une récursion infinie et resolve() tentera d'aplatir ce qui ressemble à une promesse imbriquée à l'infini.

+
+ +

Syntaxe

+ +
Promise.resolve(valeur);
+Promise.resolve(promesse);
+Promise.resolve(suivant);
+
+ +

Paramètres

+ +
+
valeur
+
L'argument qu'on souhaite résoudre avec cette promesse (Promise). Cet argument peut être un objet Promise ou un objet avec une méthode then à résoudre à la suite.
+
+ +

Valeur de retour

+ +

Une promesse ({{jsxref("Promise")}}) qui est résolue avec la valeur indiquée en argument ou la promesse passée en argument si celui-ci est une promesse.

+ +

Description

+ +

La fonction statique Promise.resolve renvoie un objet Promise qui est résolu.

+ +

Exemples

+ +

Utilisation de la méthode statique Promise.resolve

+ +
Promise.resolve("Succès").then(function(valeur) {
+  console.log(valeur); // "Succès"
+}, function(valeur) {
+  // n'est pas appelée
+});
+
+ +

Résoudre un tableau

+ +
var p = Promise.resolve([1,2,3]);
+p.then(function(v) {
+  console.log(v[0]); // 1
+});
+
+ +

Résoudre une autre Promise

+ +
var original = Promise.resolve(33);
+var cast = Promise.resolve(original);
+cast.then(function(value) {
+  console.log("value: " + value);
+});
+console.log("original === cast ? " + (original === cast));
+
+// affiche ceci dans la console (dans cet ordre) :
+// original === cast ? true
+// value: 33
+
+ +

L'ordre des traces dans la console est dû au fait que les gestionnaires then() sont appelés de façon asynchrone (plus de détails sur then dans cet article).

+ +

Résoudre des objets avec then et renvoyer des erreurs

+ +
// Résoudre un objet avec then
+var p1 = Promise.resolve({
+  then: function(onFulfill, onReject) { onFulfill("tenue !"); }
+});
+console.log(p1 instanceof Promise) // true, l'objet est transformée en une Promise
+
+p1.then(function(v) {
+    console.log(v); // "tenue !"
+  }, function(e) {
+    // n'est pas appelée
+});
+
+// L'objet avec then renvoie une erreur avant le callback
+// La promesse n'est pas tenue
+var thenable = { then: function(resolve) {
+  throw new TypeError("Renvoi d'erreur");
+  resolve("Résolution ");
+}};
+
+var p2 = Promise.resolve(thenable);
+p2.then(function(v) {
+  // n'est pas appelée
+}, function(e) {
+  console.log(e); // TypeError : Renvoi d'erreur
+});
+
+// L'objet avec then renvoie une erreur après le callback
+// La promesse est tenue
+var thenable = { then: function(resolve) {
+  resolve("Résolue");
+  throw new TypeError("Erreur");
+}};
+
+var p3 = Promise.resolve(thenable);
+p3.then(function(v) {
+  console.log(v); // "Résolue"
+}, function(e) {
+  // n'est pas appelée
+});
+
+ +

Spécifications

+ + + + + + + + + + + + + + + + + + + +
SpécificationÉtatCommentaires
{{SpecName('ES2015', '#sec-promise.reject', 'Promise.reject')}}{{Spec2('ES2015')}}Définition initiale au sein d'un standard ECMA.
{{SpecName('ESDraft', '#sec-promise.resolve', 'Promise.resolve')}}{{Spec2('ESDraft')}} 
+ +

Compatibilité des navigateurs

+ +

{{Compat("javascript.builtins.Promise.resolve")}}

+ +

Voir aussi

+ + diff --git a/files/fr/web/javascript/reference/global_objects/promise/then/index.html b/files/fr/web/javascript/reference/global_objects/promise/then/index.html deleted file mode 100644 index cf5990f1ea..0000000000 --- a/files/fr/web/javascript/reference/global_objects/promise/then/index.html +++ /dev/null @@ -1,264 +0,0 @@ ---- -title: Promise.prototype.then() -slug: Web/JavaScript/Reference/Global_Objects/Promise/then -tags: - - ECMAScript6 - - JavaScript - - Méthode - - Promise - - Prototype - - Reference -translation_of: Web/JavaScript/Reference/Global_Objects/Promise/then -original_slug: Web/JavaScript/Reference/Objets_globaux/Promise/then ---- -
{{JSRef}}
- -

La méthode then() renvoie un objet {{jsxref("Promise")}}. Elle peut prendre jusqu'à deux arguments qui sont deux fonctions callback à utiliser en cas de complétion ou d'échec de la Promise.

- -
{{EmbedInteractiveExample("pages/js/promise-then.html")}}
- - - -
-

Note : Si aucun des deux arguments n'est utilisé ou que les objets fournis ne sont pas des fonctions, une nouvelle promesse est créée sans autre gestionnaire supplémentaire. Si le premier argument est absent ou qu'un objet qui n'est pas une fonction est passé, la nouvelle promesse utilisera la fonction de réussite de la promesse originelle. De même, si le deuxième argument n'est pas passé ou que ce n'est pas une fonction, la nouvelle promesse créée utilisera la fonction de rejet de la promesse appelante.

-
- -

Syntaxe

- -
p.then(siTenue);
-p.then(siTenue, siRejetée);
-
-p.then((valeur) => {
-    // Promesse tenue
-  }, (raison) => {
-    // Rejet de la promesse
-});
-
- -

Paramètres

- - - -
-
siTenue
-
Une {{jsxref("Function","fonction","",1)}} appelée lorsque la Promise est tenue. Cette fonction a un seul argument, la valeur qui a permis de résoudre la promesse. Si siTenue n'est pas une fonction, elle est implicitement remplacée par une fonction « identité » qui renvoie l'argument tel quel.
-
siRejetée {{optional_inline}}
-
Une {{jsxref("Function","fonction","",1)}} appelée lorsque la Promise est rejetée. Cette fonction a un seul argument, la raison pour laquelle la promesse a été rejetée. Si siRejetée n'est pas une fonction, elle est implicitement remplacée par une fonction qui lève une erreur avec la raison passée en argument.
-
- -

Valeur de retour

- -

La méthode then() renvoie une promesse ({{jsxref("Promise")}}) en attente de résolution et dont la valeur est déterminée selon les deux fonctions passées en arguments et qui seront appelées de façon asynchrone :

- - - -

Description

- -

Comme les méthodes then() et {{jsxref("Promise.prototype.catch()")}} renvoient des promesses, on peut enchaîner ces opérations (c'est ce qu'on appelle la composition de promesses, voir l'exemple ci-après).

- -

Exemples

- -

Utilisation de la méthode then()

- -
var p1 = new Promise(function(resolve, reject) {
-  resolve("Succès !");
-  // ou
-  // reject("Erreur !");
-});
-
-p1.then((valeur) => {
-  console.log(valeur); // Succès !
-  }, (raison) => {
-  console.log(raison); // Erreur !
-});
-
- -

Composition - Chaînage

- -

La méthode then() renvoie un objet Promise, ce qui permet d'enchaîner les opération. On peut passer une fonction lambda à then puis utiliser la promesse obtenue pour la passer à la méthode suivante. Dans l'exemple ci-après, on simule un code asynchrone avec la fonction setTimeout.

- -
Promise.resolve("toto")
-  // 1. Première étape, on reçoit "toto" et on le concatène avec
-  //    "truc", ce qui résoud la première étape puis on passe au
-  //    deuxième then
-  .then(function(string) {
-    return new Promise(function(resolve, reject) {
-      setTimeout(function() {
-        string += 'truc';
-        resolve(string);
-      }, 1);
-    });
-  })
-  // 2. Deuxième étape, on reçoit "tototruc" et on enregistre une
-  //    fonction de rappel pour manipuler cette chaîne puis l'imprimer
-  //    dans la console. Avant cela, on passe la chaîne intacte au
-  //    prochain then
-  .then(function(string) {
-    setTimeout(function() {
-      string += 'baz';
-      console.log(string);
-    }, 1)
-    return string;
-  })
-  // 3. On affiche un message sur le code, celui-ci sera affiché
-  //    avant que la chaîne soit traitée dans le bloc précédent
-  //    qui agit comme un bloc asynchrone.
-  .then(function(string) {
-    console.log("Et voilà la dernière, qui risque d'arriver avant la 2e");
-
-    // Ici, la chaîne n'aura pas le morceau 'baz' car la fonction
-    // setTimeout retarde l'exécution du code.
-    console.log(string);
-});
-
- -

Lorsqu'une valeur est simplement renvoyée depuis une fonction lambda then, celle-ci renverra Promise.resolve(<la valeur renvoyée par le gestionnaire appelé>).

- -
var p2 = new Promise(function(resolve, reject) {
-  resolve(1);
-});
-
-p2.then(function(valeur) {
-  console.log(valeur); // 1
-  return valeur + 1;
-  }).then(function(valeur) {
-  console.log(valeur + "- cette utilisation synchrone est un peu inutile");
-  // 2- cette utilisation synchrone est un peu inutile
-});
-
-p2.then(function(valeur) {
-  console.log(valeur); // 1
-});
-
- -

Appeler then() renverra une promesse rompue si la fonction lève une exception ou si elle renvoie une promesse rompue.

- -
Promise.resolve()
-  .then( () => {
-    // Ici .then() lève une exception
-    throw 'Oh zut :( !';
-  })
-  .then( () => {
-    console.log( "Ceci n'est pas appelé." );
-  }, raison => {
-    console.error( 'la fonction siRompue est appelée : ' + raison );
-});
- -

Dans tous les autres cas, un promesse de résolution est renvoyée. Dans l'exemple qui suit, le premier then() renvoie 42 même si la promesse précédente a été rompue :

- -
Promise.reject()
-  .then( () => 99, () => 42 ) // la valeur 42 est renvoyée dans une promesse
-  .then( solution => console.log( 'Résolue avec ' + solution ) ); // Résolue avec 42
- -

En pratique, il est souvent préférable d'attraper les promesses rompues plutôt que d'utiliser la syntaxe de then() avec deux fonctions :

- -
Promise.resolve()
-  .then( () => {
-    // .then() renvoie une promesse rompue
-    throw 'Oh zut !';
-  })
-  .catch( raison => {
-    console.error( 'fonction siRompue appelée : ' + raison );
-  })
-  .then( () => {
-    console.log("Je suis toujours appelée, même si il y a un souci avant");
-  });
- -

Le chaînage peut également être utilisé pour implémenter une fonction utilisant une API basée sur les promesses et encapsuler une autre fonction :

- -
function fetch_current_data() {
-  // L'API fetch renvoie une promesse. Cette fonction
-  // expose une API similaire mais lorsque la promesse
-  // est tenue, on effectue plus de tâches
-  return fetch("current-data.json").then((response) => {
-    if (response.headers.get("content-type") != "application/json") {
-      throw new TypeError();
-    }
-    var j = response.json();
-    // on peut ici manipuler j si besoin
-    return j; // la valeur fournie à l'utilisateur de
-              // fetch_current_data().then()
-  });
-}
-
- -

Si le gestionnaire siTenue renvoie une promesse, la valeur de retour de then() sera alors résolue/rompue par cette promesse.

- -
function resoudrePlusTard(resolve, reject) {
-  setTimeout(function () {
-    resolve(10);
-  }, 1000);
-}
-function romprePlusTard(resolve, reject) {
-  setTimeout(function () {
-    reject(20);
-  }, 1000);
-}
-
-var p1 = Promise.resolve("toto");
-var p2 = p1.then(function() {
-  // On renvoie une nouvelle promesse
-  // qui sera résolue avec la valeur 10
-  // au bout d'une seconde
-  return new Promise(resoudrePlusTard);
-});
-p2.then(function(v) {
-  console.log("tenue", v);
-  // "tenue", 10
-}, function(e) {
-  // ceci n'est pas appelé
-  console.log("rompue", e);
-});
-
-var p3 = p1.then(function() {
-  // Ici, on renvoie une promesse
-  // qui sera rompue avec la valeur
-  // 20 au bout d'une seconde
-  return new Promise(romprePlusTard);
-});
-p3.then(function(v) {
-  // ceci n'est pas appelé
-  console.log("tenue", v);
-}, function(e) {
-  console.log("rompue", e);
-  // "rompue", 20
-});
-
- -

Spécifications

- - - - - - - - - - - - - - - - - - - -
SpécificationÉtatCommentaires
{{SpecName('ES2015', '#sec-promise.prototype.then', 'Promise.prototype.then')}}{{Spec2('ES2015')}}Définition initiale au sein d'un standard ECMA.
{{SpecName('ESDraft', '#sec-promise.prototype.then', 'Promise.prototype.then')}}{{Spec2('ESDraft')}}
- -

Compatibilité des navigateurs

- -

{{Compat("javascript.builtins.Promise.then")}}

- -

Voir aussi

- - diff --git a/files/fr/web/javascript/reference/global_objects/promise/then/index.md b/files/fr/web/javascript/reference/global_objects/promise/then/index.md new file mode 100644 index 0000000000..cf5990f1ea --- /dev/null +++ b/files/fr/web/javascript/reference/global_objects/promise/then/index.md @@ -0,0 +1,264 @@ +--- +title: Promise.prototype.then() +slug: Web/JavaScript/Reference/Global_Objects/Promise/then +tags: + - ECMAScript6 + - JavaScript + - Méthode + - Promise + - Prototype + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Promise/then +original_slug: Web/JavaScript/Reference/Objets_globaux/Promise/then +--- +
{{JSRef}}
+ +

La méthode then() renvoie un objet {{jsxref("Promise")}}. Elle peut prendre jusqu'à deux arguments qui sont deux fonctions callback à utiliser en cas de complétion ou d'échec de la Promise.

+ +
{{EmbedInteractiveExample("pages/js/promise-then.html")}}
+ + + +
+

Note : Si aucun des deux arguments n'est utilisé ou que les objets fournis ne sont pas des fonctions, une nouvelle promesse est créée sans autre gestionnaire supplémentaire. Si le premier argument est absent ou qu'un objet qui n'est pas une fonction est passé, la nouvelle promesse utilisera la fonction de réussite de la promesse originelle. De même, si le deuxième argument n'est pas passé ou que ce n'est pas une fonction, la nouvelle promesse créée utilisera la fonction de rejet de la promesse appelante.

+
+ +

Syntaxe

+ +
p.then(siTenue);
+p.then(siTenue, siRejetée);
+
+p.then((valeur) => {
+    // Promesse tenue
+  }, (raison) => {
+    // Rejet de la promesse
+});
+
+ +

Paramètres

+ + + +
+
siTenue
+
Une {{jsxref("Function","fonction","",1)}} appelée lorsque la Promise est tenue. Cette fonction a un seul argument, la valeur qui a permis de résoudre la promesse. Si siTenue n'est pas une fonction, elle est implicitement remplacée par une fonction « identité » qui renvoie l'argument tel quel.
+
siRejetée {{optional_inline}}
+
Une {{jsxref("Function","fonction","",1)}} appelée lorsque la Promise est rejetée. Cette fonction a un seul argument, la raison pour laquelle la promesse a été rejetée. Si siRejetée n'est pas une fonction, elle est implicitement remplacée par une fonction qui lève une erreur avec la raison passée en argument.
+
+ +

Valeur de retour

+ +

La méthode then() renvoie une promesse ({{jsxref("Promise")}}) en attente de résolution et dont la valeur est déterminée selon les deux fonctions passées en arguments et qui seront appelées de façon asynchrone :

+ + + +

Description

+ +

Comme les méthodes then() et {{jsxref("Promise.prototype.catch()")}} renvoient des promesses, on peut enchaîner ces opérations (c'est ce qu'on appelle la composition de promesses, voir l'exemple ci-après).

+ +

Exemples

+ +

Utilisation de la méthode then()

+ +
var p1 = new Promise(function(resolve, reject) {
+  resolve("Succès !");
+  // ou
+  // reject("Erreur !");
+});
+
+p1.then((valeur) => {
+  console.log(valeur); // Succès !
+  }, (raison) => {
+  console.log(raison); // Erreur !
+});
+
+ +

Composition - Chaînage

+ +

La méthode then() renvoie un objet Promise, ce qui permet d'enchaîner les opération. On peut passer une fonction lambda à then puis utiliser la promesse obtenue pour la passer à la méthode suivante. Dans l'exemple ci-après, on simule un code asynchrone avec la fonction setTimeout.

+ +
Promise.resolve("toto")
+  // 1. Première étape, on reçoit "toto" et on le concatène avec
+  //    "truc", ce qui résoud la première étape puis on passe au
+  //    deuxième then
+  .then(function(string) {
+    return new Promise(function(resolve, reject) {
+      setTimeout(function() {
+        string += 'truc';
+        resolve(string);
+      }, 1);
+    });
+  })
+  // 2. Deuxième étape, on reçoit "tototruc" et on enregistre une
+  //    fonction de rappel pour manipuler cette chaîne puis l'imprimer
+  //    dans la console. Avant cela, on passe la chaîne intacte au
+  //    prochain then
+  .then(function(string) {
+    setTimeout(function() {
+      string += 'baz';
+      console.log(string);
+    }, 1)
+    return string;
+  })
+  // 3. On affiche un message sur le code, celui-ci sera affiché
+  //    avant que la chaîne soit traitée dans le bloc précédent
+  //    qui agit comme un bloc asynchrone.
+  .then(function(string) {
+    console.log("Et voilà la dernière, qui risque d'arriver avant la 2e");
+
+    // Ici, la chaîne n'aura pas le morceau 'baz' car la fonction
+    // setTimeout retarde l'exécution du code.
+    console.log(string);
+});
+
+ +

Lorsqu'une valeur est simplement renvoyée depuis une fonction lambda then, celle-ci renverra Promise.resolve(<la valeur renvoyée par le gestionnaire appelé>).

+ +
var p2 = new Promise(function(resolve, reject) {
+  resolve(1);
+});
+
+p2.then(function(valeur) {
+  console.log(valeur); // 1
+  return valeur + 1;
+  }).then(function(valeur) {
+  console.log(valeur + "- cette utilisation synchrone est un peu inutile");
+  // 2- cette utilisation synchrone est un peu inutile
+});
+
+p2.then(function(valeur) {
+  console.log(valeur); // 1
+});
+
+ +

Appeler then() renverra une promesse rompue si la fonction lève une exception ou si elle renvoie une promesse rompue.

+ +
Promise.resolve()
+  .then( () => {
+    // Ici .then() lève une exception
+    throw 'Oh zut :( !';
+  })
+  .then( () => {
+    console.log( "Ceci n'est pas appelé." );
+  }, raison => {
+    console.error( 'la fonction siRompue est appelée : ' + raison );
+});
+ +

Dans tous les autres cas, un promesse de résolution est renvoyée. Dans l'exemple qui suit, le premier then() renvoie 42 même si la promesse précédente a été rompue :

+ +
Promise.reject()
+  .then( () => 99, () => 42 ) // la valeur 42 est renvoyée dans une promesse
+  .then( solution => console.log( 'Résolue avec ' + solution ) ); // Résolue avec 42
+ +

En pratique, il est souvent préférable d'attraper les promesses rompues plutôt que d'utiliser la syntaxe de then() avec deux fonctions :

+ +
Promise.resolve()
+  .then( () => {
+    // .then() renvoie une promesse rompue
+    throw 'Oh zut !';
+  })
+  .catch( raison => {
+    console.error( 'fonction siRompue appelée : ' + raison );
+  })
+  .then( () => {
+    console.log("Je suis toujours appelée, même si il y a un souci avant");
+  });
+ +

Le chaînage peut également être utilisé pour implémenter une fonction utilisant une API basée sur les promesses et encapsuler une autre fonction :

+ +
function fetch_current_data() {
+  // L'API fetch renvoie une promesse. Cette fonction
+  // expose une API similaire mais lorsque la promesse
+  // est tenue, on effectue plus de tâches
+  return fetch("current-data.json").then((response) => {
+    if (response.headers.get("content-type") != "application/json") {
+      throw new TypeError();
+    }
+    var j = response.json();
+    // on peut ici manipuler j si besoin
+    return j; // la valeur fournie à l'utilisateur de
+              // fetch_current_data().then()
+  });
+}
+
+ +

Si le gestionnaire siTenue renvoie une promesse, la valeur de retour de then() sera alors résolue/rompue par cette promesse.

+ +
function resoudrePlusTard(resolve, reject) {
+  setTimeout(function () {
+    resolve(10);
+  }, 1000);
+}
+function romprePlusTard(resolve, reject) {
+  setTimeout(function () {
+    reject(20);
+  }, 1000);
+}
+
+var p1 = Promise.resolve("toto");
+var p2 = p1.then(function() {
+  // On renvoie une nouvelle promesse
+  // qui sera résolue avec la valeur 10
+  // au bout d'une seconde
+  return new Promise(resoudrePlusTard);
+});
+p2.then(function(v) {
+  console.log("tenue", v);
+  // "tenue", 10
+}, function(e) {
+  // ceci n'est pas appelé
+  console.log("rompue", e);
+});
+
+var p3 = p1.then(function() {
+  // Ici, on renvoie une promesse
+  // qui sera rompue avec la valeur
+  // 20 au bout d'une seconde
+  return new Promise(romprePlusTard);
+});
+p3.then(function(v) {
+  // ceci n'est pas appelé
+  console.log("tenue", v);
+}, function(e) {
+  console.log("rompue", e);
+  // "rompue", 20
+});
+
+ +

Spécifications

+ + + + + + + + + + + + + + + + + + + +
SpécificationÉtatCommentaires
{{SpecName('ES2015', '#sec-promise.prototype.then', 'Promise.prototype.then')}}{{Spec2('ES2015')}}Définition initiale au sein d'un standard ECMA.
{{SpecName('ESDraft', '#sec-promise.prototype.then', 'Promise.prototype.then')}}{{Spec2('ESDraft')}}
+ +

Compatibilité des navigateurs

+ +

{{Compat("javascript.builtins.Promise.then")}}

+ +

Voir aussi

+ + -- cgit v1.2.3-54-g00ecf