2010-04-24 2 views
0

Pourquoi le code suivant affiche "0 5 10 15 20 ... 100"?Javascript Closure question

(function() { 
for (var i = 100; i >= 0; i -= 5) { 
    (function() { 
     var pos = i; 
     setTimeout(function() { 
      console.log(" pos = " + pos); 
     }, (pos + 1)*10); 
    })(); 
} 
})(); 

Je déclare pos = i, qui doit être dans un ordre décroissant. Ce code provient de la fonction fadeIn() de John Resig dans son livre Pro javascript techniques.

Répondre

7

Vous vous inscrivez les délais d'attente dans l'ordre correct, le problème est qu'ils sont chronométrés afin de leur valeur, de sorte que la valeur 10 sera imprimée en 100 ms, la valeur 100 dans 1000ms, etc.

Vous besoin de changer le calcul de minutage pour soustraire de la valeur maximale (dans ce cas, 100)

(function() { 
for (var i = 100; i >= 0; i -= 5) { 
    (function() { 
     var pos = i; 
     setTimeout(function() { 
      console.log(" pos = " + pos); 
     }, (100 - pos + 1)*10); // note the subtraction here 
    })(); 
} 
})();