Mozilla's getting a new look. What do you think? https://mzl.la/brandsurvey

Promise.prototype.then()

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

Syntaxe

p.then(siTenue, siRejetée);

p.then(function(valeur) {
   // Promesse tenue
  }, function(raison) {
  // Rejet de la promesse
});

Paramètres

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
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()
  });
}

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,