no wrap (head) vs onLoad

Question

En este demo, obtuve salidas diferentes, si uso (sin envoltura) o (onLoad).

Mi pregunta es, en el archivo html, para obtener una alerta correcta: 1,2,3,4 ¿Qué modificación es necesaria en el código? Con una carga sencilla del dojo me dieron siempre 4 en todas las alertas:

<script src="http://ajax.googleapis.com/ajax/libs/dojo/1.6/dojo/dojo.xd.js"></script> 

<script type="text/javascript"> 
    var slider = []; 

    for (i = 0; i < 4; i++) { 

     slider[i] = function() { 

      alert([i]); 

     }; 
     dojo.addOnLoad(slider[i]); 
    } 
    </script> 

Answer 1

Se puede usar un closure:

var slider = []; 

for (i = 1; i < 5; i++) { 

    slider[i] = (function (i) { 

     return function() { alert([i]); } 

    })(i); 
    dojo.addOnLoad(slider[i]); 
} 

Esto ahorrará i en otra funciones guardar el estado alcance. Sin el cierre, i tiene el alcance de la función original.

Answer 2

El valor de i es 4 al final del bucle, que es lo que sus funciones verán cuando se les llama. Algo como esto debería funcionar:

<script src="http://ajax.googleapis.com/ajax/libs/dojo/1.6/dojo/dojo.xd.js"></script> 

<script type="text/javascript"> 
var slider = []; 

for (i = 0; i < 4; i++) { 
    eval("slider[i] = function() { alert([" + i + "]);};"); 
    dojo.addOnLoad(slider[i]); 
} 
</script> 

Editar: así también se podría tratar de hacer el recuento cuando las funciones se llaman en lugar de cuando están definidos. p.ej.

<script src="http://ajax.googleapis.com/ajax/libs/dojo/1.6/dojo/dojo.xd.js"></script> 

<script type="text/javascript"> 
var slider = []; 
var onLoadCounter = 0; 

var onLoadCallback = function() { 
    alert(onLoadCounter); 
    onLoadCounter++; 
}; 

for (i = 0; i < 4; i++) { 
    slider[i] = onLoadCallback; 
    dojo.addOnLoad(slider[i]); 
} 
</script>