Maison >interface Web >js tutoriel >Explication détaillée de l'implémentation de la programmation asynchrone du nœud Async/Await

Explication détaillée de l'implémentation de la programmation asynchrone du nœud Async/Await

php中世界最好的语言
php中世界最好的语言original
2018-05-22 11:46:302134parcourir

Cette fois, je vous apporte une explication détaillée de l'implémentation de la programmation asynchrone du nœud Async/Await, quelles sont les notes pour l'implémentation de la programmation asynchrone du nœud Async/Await, ce qui suit est un guide pratique Dans ce cas, jetons un coup d'œil ensemble. Jetez un œil.

1. La solution ultime à la programmation asynchrone

Il y a quelques jours, j'ai écrit un article sur les opérations asynchrones javascript " Explication détaillée de Javascript Promise. Récemment, alors que j'apprenais Puppeteer, j'ai découvert une autre solution de programmation asynchrone : Async/Await. programme pour tenter de résoudre ce problème. De la première

fonction de rappel

à l'objet Promise , puis à la fonction Générateur, il y a des améliorations à chaque fois, mais cela semble incomplet. Ils présentent tous des complexités supplémentaires et nécessitent une compréhension des mécanismes de fonctionnement sous-jacents de l’abstraction. Après la sortie de la fonction Async, certaines personnes ont pensé que c'était la solution ultime à la programmation asynchrone. Parce qu'avec Async/Await, vous n'avez pas à vous soucier de savoir s'il s'agit d'une programmation asynchrone.

2. Utilisation de baseLa fonction asynchrone renvoie un objet Promise et vous pouvez utiliser la méthode then pour ajouter une fonction de rappel. Lorsque la fonction est exécutée, une fois qu'elle rencontre wait, elle reviendra d'abord, attendra que l'opération asynchrone déclenchée soit terminée, puis exécutera les instructions suivantes dans le corps de la fonction.

Ce qui suit est une châtaigne :

Exécutez le code ci-dessus, vous constaterez que les premières sorties de la console démarrent, et après avoir attendu 3 secondes, les sorties se terminent.
var sleep = function (time) {
  return new Promise(function (resolve, reject) {
    setTimeout(function () {
      resolve();
    }, time);
  })
};
var start = async function () {
  // 在这里使用起来就像同步代码那样直观
  console.log('start');
  await sleep(3000);
  console.log('end');
};
start();

3. Notes1. La commande wait ne peut être utilisée que dans des fonctions asynchrones. Si elle est utilisée dans des fonctions ordinaires, une erreur sera générée. rapporté.

2. wait signifie attendre la promesse de renvoyer le résultat avant de poursuivre l'exécution.
async function dbFuc(db) {
 let docs = [{}, {}, {}];
 // 报错
 docs.forEach(function (doc) {
  await db.post(doc);
 });
}

3. L'attente doit être suivie d'un objet de promesse.
var sleep = function (time) {
  return new Promise(function (resolve, reject) {
    setTimeout(function () {
      // 返回 ‘ok'
      resolve('ok');
    }, time);
  })
};
var start = async function () {
  let result = await sleep(3000);
  console.log(result); // 收到 ‘ok'
};

Si le code est exécuté de manière synchrone, il n'est pas nécessaire d'utiliser la modification en attente.

4. wait ne peut être utilisé qu'en syntaxe native. Par exemple, l'utilisation de wait dans la structure forEeach ne fonctionnera pas correctement et la syntaxe native de la boucle for doit être utilisée.

Si vous souhaitez vraiment que plusieurs requêtes s'exécutent simultanément, vous pouvez utiliser la méthode Promise.all.
async function dbFuc(db) {
 let docs = [{}, {}, {}];
 // 可能得到错误结果
 docs.forEach(async function (doc) {
  await db.post(doc);
 });
}

async function dbFuc(db) {
 let docs = [{}, {}, {}];
 let promises = docs.map((doc) => db.post(doc));
 let results = await Promise.all(promises);
 console.log(results);
}

4. Capture d'erreurPuisque .then(..) n'a pas besoin d'être écrit, alors .catch(. .) également Pas besoin d'écrire, vous pouvez directement utiliser la syntaxe standard try catch pour détecter les erreurs.

Je pense que vous maîtrisez la méthode après avoir lu le cas dans cet article. Pour des informations plus intéressantes, veuillez prêter attention aux autres articles connexes sur le site Web chinois de php !
var sleep = function (time) {
  return new Promise(function (resolve, reject) {
    setTimeout(function () {
      // 模拟出错了,返回 ‘error'
      reject('error');
    }, time);
  })
};
var start = async function () {
  try {
    console.log('start');
    await sleep(3000); // 这里得到了一个返回错误
    
    // 所以以下代码不会被执行了
    console.log('end');
  } catch (err) {
    console.log(err); // 这里捕捉到错误 `error`
  }
};

Lecture recommandée :

Propriétés calculées de Vue et analyse du code de cas d'écoute


Explication détaillée des étapes pour utiliser vuex ensemble avec composants

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!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn