Promise.prototype.then()

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

Note : Si aucun des deux arguments n'est utilisé ou que ce sont des objets qui ne sont pas des fonctions qui sont fournis, 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(function(valeur) {
   // Promesse tenue
  }, function(raison) {
  // Rejet de la promesse
});

Paramètres

La méthode then() renvoie une promesse dont la valeur est déterminée selon les deux fonctions passées à then() :

  • Si siRejetée ou siTenue lève une exception ou renvoie une promesse rompue, la promesse renvoyée par then() est rompue
  • Si siRejetée ou siTenue renvoie une promesse tenue ou n'importe quelle autre valeur, la promesse renvoyée est tenue.
siTenue
Une fonction appelée lorsque la Promise est tenue. Cette fonction a un seul argument, la valeur qui a permis de résoudre la promesse.
siRejetée Facultatif
Une fonction appelée lorsque la Promise est rejetée. Cette fonction a un seul argument, la raison pour laquelle la promesse a été rejetée.

Valeur de retour

Une promesse (Promise).

Description

Comme les méthodes then et Promise.prototype.catch() renvoient des promesses, elles peuvent s'enchaîner grâce à la composition de promesses.

Exemples

Utilisation de la méthode then

var p1 = new Promise(function(resolve, reject) {
  resolve("Succès !");
  // ou
  // reject("Erreur !");
});

p1.then(function(valeur) {
  console.log(valeur); // Succès !
}, function(raison) {
  console.log(raison); // Erreur !
});

Composition - Chaînage

La méthode then renvoie une Promise, on peut donc facilement enchaîner plusieurs appels à la méthode then. Les valeurs renvoyées par les méthodes de succès (siTenue) ou d'échec (siRompue) seront automatiquement converties en promesses résolues (sur lesquelles on pourra utiliser then).

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); // 2
});

p2.then(function(valeur) {
  console.log(valeur); // 1
});

Vous pouvez également utiliser le chaînage pour implémenter une fonction basée sur les promesses, elle-même basée sur une API fonctionnant avec les promesses

function fetch_current_data() {
  // L'API fetch() renvoie un objet Promise. Cette fonction
  // expose une API similaire mais une couche logique est 
  // ajoutée pour déterminer la valeur utilisée pour 
  // l'accomplissement de la promesse
  return fetch("current-data.json").then((response) => {
    if (response.headers.get("content-type") != "application/json") {
      throw new TypeError();
    }
    var j = response.json();
    // éventuellement, on peut manipuler j
    return j; // la valeur d'accomplissement (fulfillment)
              // fournie à l'utilisateur avec
              // fetch_current_data().then()
  });
}

Si onFulfilled renvoie une promesse, la valeur de retour de then sera résolue / rompue par cette promesse.

function resolveLater(resolve, reject) {
  setTimeout(function () {
    resolve(10);
  }, 1000);
}
function rejectLater(resolve, reject) {
  setTimeout(function () {
    reject(20);
  }, 1000);
}

var p1 = Promise.resolve("foo");
var p2 = p1.then(function() {
  // On renvoie une promesse qui sera résolue avec la valeur
  // 10 après 1 seconde
  return new Promise(resolveLater);
});
p2.then(function(v) {
  console.log("resolved", v);  // "resolved", 10
}, function(e) {
  // not called
  console.log("rejected", e);
});

var p3 = p1.then(function() {
  // On renvoie une promesse qui sera rompue avec la valeur
  // 20 après 1 seconde
  return new Promise(rejectLater);
});
p3.then(function(v) {
  // ce n'est pas appelé
  console.log("resolved", v);
}, function(e) {
  console.log("rejected", e); // "rejected", 20
});

Spécifications

Spécification État Commentaires
ECMAScript 2015 (6th Edition, ECMA-262)
La définition de 'Promise.prototype.then' dans cette spécification.
Standard Définition initiale au sein d'un standard ECMA.
ECMAScript 2017 Draft (ECMA-262)
La définition de 'Promise.prototype.then' dans cette spécification.
Projet  

Compatibilité des navigateurs

Fonctionnalité Chrome Edge Firefox Internet Explorer Opera Safari Servo
Support simple32.0(Oui)29.0Aucun support197.1Aucun support
Fonctionnalité Android Chrome for Android Edge Mobile Firefox for Android IE Mobile Opera Mobile Safari Mobile
Support simple4.4.432.0(Oui)29Aucun support(Oui)8.0

Voir aussi

Étiquettes et contributeurs liés au document

 Contributeurs à cette page : SphinxKnight, pablolarvor, gaelb
 Dernière mise à jour par : SphinxKnight,