Maison > interface Web > js tutoriel > le corps du texte

Comment optimiser la programmation asynchrone du nœud Async/Await

php中世界最好的语言
Libérer: 2018-05-30 14:52:04
original
1077 Les gens l'ont consulté

Cette fois, je vais vous montrer comment optimiser la programmation asynchrone des nœuds Async/Await, quelles sont les précautions pour optimiser la programmation asynchrone des nœuds Async/Await, voici des cas pratiques, Rassemblons-nous. Jetez un oeil.

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();
Copier après la connexion

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);
 });
}
Copier après la connexion

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'
};
Copier après la connexion

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. Vous devez utiliser la syntaxe native de la boucle for.

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);
 });
}
Copier après la connexion

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

4. Capture d'erreur Puisque .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`
  }
};
Copier après la connexion

Lecture recommandée :

Comment React implémente le contrôle de vérification de connexion dans le routage React-Router


Le garde de routage dans le routage angulaire Comment utiliser

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!

Étiquettes associées:
source:php.cn
Déclaration de ce site Web
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
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal
À propos de nous Clause de non-responsabilité Sitemap
Site Web PHP chinois:Formation PHP en ligne sur le bien-être public,Aidez les apprenants PHP à grandir rapidement!