Appel de plusieurs fonctions séquentiellement avec jquery

Question

Je souhaite parcourir en boucle un objet contenant des fonctions qui s'exécuteront l'une après l'autre. Mon approche la plus idéale serait d'avoir cette chaîne en quelque sorte (c'est-à func2 attend func1 et func3 attend func2) mais cela doit se produire dynamiquement et les fonctions auront toutes des durées différentes. J'utilise jQuery alors j'ai pensé que peut-être "queue()" peut aider mais je n'ai pas beaucoup travaillé avec.

A main concern est d'ajouter aucune portée/callback aux fonctions dans l'objet. Je préfère les inclure dans une fonction parent pour les exécuter dans la boucle afin de créer le callback/chaining.

Voici un exemple de ce que j'ai maintenant, mais abruti. Merci pour toute aide!

var obj = [ 
{'name':'func1','callback':function(){ alert(1); }}, 
{'name':'func2','callback':function(){ alert(2); }}, 
{'name':'func3','callback':function(){ alert(3); }} 
]; 

$.each(obj, function(x, el) { 
    el.callback(); 
}); 

Answer 1

Essayez ceci:

var obj = [ 
    function() { alert(1); }, 
    function() { alert(2); }, 
    function() { alert(3); } 
]; 
$.each(obj,function() { 
    // Replace 500 with whatever you want 
    setTimeout(this,500); 
}); 

Vous pouvez également utiliser une boucle for, car il n'y a aucune raison d'utiliser $.each, bien qu'il n'y a pas de problème:

for (var i = 0; i < obj.length; i++) { 
    // Replace 500 with whatever you want 
    setTimeout(this[i],500); 
} 

Cela dépend aussi si vous voulez avoir un timing différent en fonction de la fonction que vous exécutez.

est ici pour une boucle for:

for (var i = 0; i < obj.length; i++) { 
    // Replace 500 with whatever you want 
    setTimeout(this[i],500 * i); 
} 

Et avec $.each:

$.each(obj,function(i) { 
    // Replace 500 with whatever you want 
    setTimeout(this,500 * i); 
}); 

Answer 2

La bibliothèque async-waterfall peut également vous aider à le faire.