Javascript Girl
  1. Javascript Girl
  3. JavaScript: exécute la fonction asynchrone une par une
Intereting Posts
Obtenir la première lettre de chaque mot dans une chaîne, en Javascript Comment obtenir le résultat de console.trace () en tant que chaîne dans javascript avec chrome ou firefox? Javascript string to object Pourquoi ne puis-je pas laisser Javascript parler à ActionScript Chrome Dev Tools: affiche tous les auditeurs d'événements utilisés dans la page Activer une erreur en exigeant le module dans node.js Désactiver "utiliser la forme de fonction d'utilisation stricte", mais conserver l'avertissement "Manquant" utiliser l'énoncé strict Comment empêcher les utilisateurs de soumettre un formulaire deux fois Google Maps JS API v3 – Exemple de marqueur multiple simple Comment lier onclick handlers à `this` correctement sur React Pourquoi la fonction de tri de javascript ne fonctionne-t-elle pas bien? Réactiver le routeur – passer des accessoires sur les routes vers les composants enfants J'essaie de créer une méthode de substr avec un pointeur … existe-t-il une solution plus élégante? PyQt (PySide), WebKit et les méthodes d'exposition de / vers Javascript Est-ce que … pour un opérateur ou une syntaxe?

JavaScript: exécute la fonction asynchrone une par une

J'ai une fonction JS "Async" simple: 

function asyncFunc(i) { setTimeout(function () { console.log(i); }, 1000); }

Si je veux exécuter ce asyncFunc 5 fois dans une boucle for, c'est-à-dire un journal de 1 à 5 par seconde et coûte totalement 5 secondes.

1

2

3

4

5

Je sais que jQuery est quand (). Done () peut faire cela si je suis dans un environnement avec des bibliothèques de N ° 3 de JS, quelle est la manière la plus simple et la plus élégante d'y parvenir ?

En fait, par exemple, je souhaite écrire une fonction util qui accepte un tableau de fonctions asynchrones et cette fonction utilitaire peut exécuter les fonctions passées une par une: 

 function execAsyncTasks([asyncTask1, asyncTask2, asyncTask3]) { asyncTask1(); // Wait until asyncTask1 finished asyncTask2(); // Wait until asyncTask2 finished asyncTask3(); // Wait until asyncTask3 finished }

Toutes vos tâches devront implémenter une sorte de mécanisme de rappel, car c'est la seule façon de savoir qu'une tâche asynchrone a été complétée. Cela étant, vous pourriez faire quelque chose comme: 

 function executeTasks() { var tasks = Array.prototype.concat.apply([], arguments); var task = tasks.shift(); task(function() { if(tasks.length > 0) executeTasks.apply(this, tasks); }); } executeTasks(t1, t2, t3, t4);

Démonstration

Vous pouvez utiliser le module Async:

https://github.com/caolan/async 

 async.parallel([ function(){ ... }, function(){ ... } ], callback); async.series([ function(){ ... }, function(){ ... } ]);

C'est une approche de beaucoup 

 function execAsyncTasks(asyncTask1, asyncTask2, asyncTask3) { var count = 0; function nextCommand() { switch (count) { case 0: asyncTask1(); break; case 1: asyncTask2(); break; case 2: asyncTask3(); default: return; } count++; setTimeout(nextCommand, 1000); } nextCommand(); }

Vous pouvez disposer d'un mécanisme de synchronisation à l'aide de rappels et d'appels de fonctions récursives: voir http://jsfiddle.net 

 function asyncFunc(i, callback) { setTimeout(function () { document.body.innerHTML +='<p>'+i+'</p>'; callback(); }, 1000); } var args = [0,1,2,3,4]; function loopThroughArgs(callback) { if(args.length == 0) { callback(); } else { asyncFunc(args[0], function() { args.splice(0,1); //remove the first item from args array loopThroughArgs(callback); }); } } loopThroughArgs(function() { document.body.innerHTML +='<p>done !</p>'; });