Explication détaillée de l'exécution séquentielle de promsie.all et de la promesse dans l'applet WeChat

Cet article présente principalement les informations pertinentes sur l'applet WeChat promsie.all et l'exécution séquentielle des promesses. J'espère que cet article pourra aider tout le monde. Les amis dans le besoin pourront s'y référer.

L'applet WeChat promsie.all et promise sont exécutés séquentiellement

1 Avant-propos

J'ai récemment travaillé sur un. small Lors du développement du programme, l'une des exigences rencontrées est la soumission du formulaire. L'approche de WeChat consiste à télécharger l'image en premier, et l'arrière-plan vous renverra le nom et l'adresse de l'image, puis vous insérez les informations sur l'image. dans le formulaire. Soumettez le formulaire à l'emplacement correspondant. Cela implique comment télécharger la demande d'image avant de télécharger le formulaire. De plus, s'il y a plusieurs images dans l'applet WeChat, elles ne peuvent être téléchargées qu'une par une. Pour faire simple, après avoir téléchargé l'image (plusieurs requêtes), obtenir la valeur de retour, puis télécharger le formulaire, que dois-je faire ?

2. Promise.all et Promise.race

Introduisons d'abord les différences entre les méthodes Promise.all et Promise.race Promise.all (itérable) La méthode renvoie une promesse lorsque toutes les promesses des paramètres itérables ont été complétées ou lorsque la première promesse transmise (faisant référence au rejet) échoue. iterable est un objet itérable, mais est généralement un tableau. La valeur de retour est également un objet Promise.

Quelques points doivent être clarifiés. Promise.all exécute plusieurs objets Promise simultanément, et les paramètres de l'objet Promise renvoyé sont un tableau, et chaque élément du tableau est également un objet itérable. . La commande est retournée.

La méthode Promise.race(iterable) renvoie une nouvelle promesse. Tant qu'il y a un objet de promesse "resolve" ou "reject" dans le paramètre iterable, la nouvelle promesse sera complétée immédiatement ( solve)" ou "rejeter", et obtenez la valeur de retour ou la cause de l'erreur de l'objet de promesse précédent. Ainsi, tant que l'un des itérables se termine ou échoue, un objet de promesse est renvoyé immédiatement. Selon le mot course, on peut également conclure que le premier arrivé renvoie immédiatement un objet promis.

Selon la définition ci-dessus, nous utilisons la méthode Promise.all pour compléter nos besoins.

//存储promise对象的数组
let promiseArr = [];
//图片地址数组
let imageList = [];
//将图片地址的上传的promise对象加入到promiseArr
for (let i = 0; i < imageList.length; i++) {
  let promise = new Promise((resolve, reject) => {
    //微信图片上传
    wx.uploadFile({
      url: &#39;https://xxx.xxx.xxx/api/uploadImage&#39;,
      filePath: imageList[i],
      name: &#39;file&#39;,
      success: function(res) {
        //可以对res进行处理，然后resolve返回
        resolve(res);
      },
      fail: function (error) {
        reject(error);
      },
      complete: function (res) {
      },
    })
  });
  promiseArr.push(promise)
}
//Promise.all处理promiseArr数组中的每一个promise对象
Promise.all(promiseArr).then((result) => {
  //对返回的result数组进行处理
})

3. Problèmes avec le mini-programme WeChat

Je travaille sur la fonction de téléchargement d'images de WeChat. mini programme. Ici, vous pouvez uniquement télécharger l'image en premier, puis renvoyer le nom et l'adresse de l'image en réponse.

Ici, nous utilisons la méthode promise.all, mais il y a un problème. Promise.all est exécuté simultanément, mais l'applet WeChat ne peut faire que 10 requêtes simultanées à la fois.

Pour le téléchargement d'images, vous devrez peut-être télécharger plus de 10 images à la fois, ce qui signifie plus de 10 demandes simultanées à la fois. Dans ce cas, WeChat signalera une erreur

<. 🎜>"WAService.js:4 uploadFile :fail createUploadTask:fail dépasse le nombre maximum de connexions de téléchargement 10".

4. Traitement d'exécution de la promesse séquentielle

Parce que Promise.all exécute plusieurs objets Promsie en même temps. time , il y a donc une limite au nombre de ces simultanéités. Les mini-programmes ne peuvent être simultanément que de 10 à la fois, donc si vous souhaitez dépasser cette limite, vous pouvez exécuter chaque promesse de manière séquentielle.

Le code est le suivant :

//顺序处理函数
function sequenceTasks(tasks) {
  //记录返回值
  function recordValue(results, value) {
    results.push(value);
    return results;
  }
  let pushValue = recordValue.bind(null, []);
  let promise = Promise.resolve();
  // 处理tasks数组中的每个函数对象
  for (let i = 0; i < tasks.length; i++) {
    let task = tasks[i];
    promise = promise.then(task).then(pushValue);
  }
  return promise;
}

//函数数组，每个函数的返回值是一个promise对象
let promiseFuncArr = [];
//图片地址数组
let imageList = [];
//将图片地址的上传的函数加入到promiseFuncArr数组中
for (let i = 0; i < imageList.length; i++) {
  let promiseTemp = function(){
    return new Promise((resolve, reject) => {
      //微信图片上传
      wx.uploadFile({
        url: &#39;https://xxx.xxx.xxx/api/uploadImage&#39;,
        filePath: imageList[i],
        name: &#39;file&#39;,
        success: function(res) {
          //可以对res进行处理，然后resolve返回
          resolve(res);
        },
        fail: function (error) {
          reject(error);
        },
        complete: function (res) {
        },
      })
    });
  };
  promiseFuncArr.push(promiseTemp)
}

sequenceTasks(promiseFuncArr).then((result) => {
  //对返回的result数组进行处理
});

Voici une explication du fonctionnement de la fonction séquenceTasks

<. 🎜>
Premier recordValue La fonction transmet deux valeurs, l'une est le tableau de résultats, l'autre est la valeur, la valeur est la valeur transmise, results.push(value); tableau de résultats.

pushValue est également un objet fonction. Liez recordValue à un tableau [ ] Le premier paramètre est représenté par null, ce qui ne change pas le pointeur de la fonction. ceci, donc pushValue est une fonction (valeur), et les paramètres sont transmis en valeur.

let pushValue = recordValue.bind(null, []);

la tâche est une fonction, et la fonction renvoie un objet de promesse. Dans notre cas, il s'agit de la fonction de téléchargement d'image. Une fonction est créée pour chaque téléchargement d'image. , alors (pushValue), pushValue est une fonction de la fonction (valeur). La valeur représente la valeur de retour après le téléchargement de l'image. pushValue pousse la valeur de retour dans le tableau de résultats, l'exécute en séquence, l'ajoute au tableau de résultats en séquence. , et revient enfin. Vous pouvez obtenir un tableau d'objets et le tableau contient les résultats renvoyés par une exécution séquentielle.

promise = promise.then(task).then(pushValue);

2. La boucle for dans séquenceTasks peut également être écrite dans la méthode de réduction suivante :

Recommandations associées :

function sequenceTasks(tasks) {
  //记录返回值
  function recordValue(results, value) {
    results.push(value);
    return results;
  }
  let pushValue = recordValue.bind(null, []);
  return tasks.reduce(function (promise, task) {
    return promise.then(task).then(pushValue);
  }, Promise.resolve());
}

La méthode spécifique d'utilisation de la promesse de jQuery

webpack+babel+transform-runtime, la solution au problème selon lequel la promesse n'est pas définie sous IE

Promesse, Générateur (générateur), utilisation de la fonction asynchrone (asynchrone)

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