Mitglied des Arrays ist undefined, hat alle Daten, um das Mitglied

Question

Ich habe eine Reihe von Elementen, es ist bestückt, aber alle Mitglieder sind undefined.

// Result: [div.some-class, div.some-class, div.some-class, div.some-class] 
console.log(myArray); 

// Result: 4 
console.log(myArray.length); 

for(var i = 0 ; i < myArray.length; i++) { 
    setTimeout(function() { 

     console.log(myArray[i]); // <- This is "undefined" 
     console.log(myArray); // <- Successful log: has access to array 
     console.log(i);   // <- Successful log: has access to "i" 

     // Uncaught TypeError: Cannot read property 'classList' of undefined 
     myArray[i].classList.add('yeah'); 

    }, i * 200); 
} 

---

Es funktioniert ohne Timeout:

for(var i = 0 ; i < myArray.length; i++) { 
    // No errors -> it works 
    myArray[i].classList.add('yeah'); 
} 

myArray ist ein globaler Wert und Timeout hat Zugriff auf alle Daten, die er braucht. Warum ist es immer noch undefiniert?

Answer 1

Wenn die Timeout-Funktion aufruft, hat die Schleife beendet bereits, was bedeutet, die i bis 4.

gleich ist hier eine einfache Lösung:

for(var i = 0 ; i < myArray.length; i++) { 
    (function(i) { 
     setTimeout(function(i) { 

      myArray[i].classList.add('yeah'); 

     }, i * 200) 
    })(i); 
} 

Sie einfach mit jeder den Timeout aufrufen i und übergeben Sie diese i an die Funktion