Maison >interface Web >js tutoriel >Explication détaillée de l'utilisation de async et wait
Cette fois, je vais vous apporter une explication détaillée de l'utilisation de async et wait. Quelles sont les précautions lors de l'utilisation d'async et wait. Voici des cas pratiques, jetons un coup d'œil.
Koa est un framework côté serveur Node très connu, avec les versions 1.x et 2.x. Le premier utilise un générateur pour effectuer des opérations asynchrones, et le second utilise la dernière solution async/await
Lorsque j'ai commencé à utiliser cette méthode d'écriture, j'ai rencontré un problème le code est le suivant :
<.>const Koa = require('koa'); const app = new Koa(); const doSomething = time => { return new Promise(resolve => { setTimeout(() => { resolve('task done!') }, time) }) } // 用来打印请求信息 app.use((ctx, next) => { console.log(`${ctx.method}:::${ctx.url}`) next() }) app.use(async ctx => { const result = await doSomething(3000) console.log(result); ctx.body = result }) app.listen(3000);Testons-le : curl http://localhost:3000Résultat attendu : (Après 3 secondes...) tâche terminée !Cependant , réalité Mais c'était : (immédiatement)
Introuvable
function compose (middleware) { return function (context, next) { // 这个index用来计数,防止next被多次调用 let index = -1 // 执行入口 return dispatch(0) function dispatch (i) { // 如果next被多次调用,报异常 if (i Avec la base ci-dessus, jetons un œil à la question précédente Pourquoi la réponse revient-elle immédiatement sans attendre le deuxième middleware. être exécuté ? <p style="text-align: left;"></p>Parce que le premier middleware n'est pas une fonction asynchrone. <p style="text-align: left;"></p>Puisque chaque exécution de la méthode suivante renvoie en fait un objet Promise, si nous effectuons une opération asynchrone dans un middleware, si nous voulons attendre qu'elle se termine, nous devons le faire avant d'exécuter le middleware Add wait. <p style="text-align: left;"></p> Ensuite réécrivons le code précédent<p style="text-align: left;"></p><pre class="brush:php;toolbar:false">app.use(async (ctx, next) => { console.log(`${ctx.method}:::${ctx.url}`) await next() }) app.use(async ctx => { const result = await doSomething(3000) console.log(result); ctx.body = result })D'accord, pas de problème, tout fonctionne comme prévu : clap:Avec l'aide de la puissance puissante de Promise et de la syntaxe async/await, il nous suffit d'écrire l'opération try/catch dans le middleware le plus externe, puis de capturer les exceptions pour tous les middleware !
app.use(async (ctx, next) => { try{ await next() }catch(err){ console.log(err) } }) app.use(async (ctx)=>{ throw new Error('something wrong!') ctx.body = 'Hello' })Un contrôle total basé sur la chaîne middleware, et le fait qu'il soit basé sur Promise rend tout facile à utiliser. Il n'y a plus if (err) return next(err) partout, mais seulement promesse 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 sur le site PHP chinois ! Lecture recommandée :
Explication détaillée de l'utilisation des composants de haut niveau de mixin
Utilisation du modèle ejsExcel dans Vue.js
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!