數組索引不工作在for循環

我絕對沒有發生了什麼理念。但是當我嘗試迭代這個時，使用第12行中的[i]，它不起作用，我得到了完全空白的範圍。但是，如果不改變其他任何內容，只需將第12行上的[i]切換爲[0]，例如，我就可以按預期寫入span！數組索引不工作在for循環

任何想法？

$(function() { 
    var listaCoisas = [ 
     "disruptiva", 
     "matadora", 
     "feroz", 
     "tradicional" 
    ]; 

    var i; 
    for (i=0; i<listaCoisas.length; i++){ 
     setTimeout(function(){ 
      $('#word-attribute').empty().append(listaCoisas[3]); 
     },1000); 
    } 
});

來源

2017-08-16 diegodacal

setTimeout是異步的。當調用回調中的代碼時，爲現代瀏覽器調用'i == listaCoisas.length'，改變'var i; 爲（i = 0; ...''到設爲I = 0; ...'或者，嘗試使用'listaCoisas.forEach'代替 –

的事情是，我真的需要使用的setTimeout（或任何延遲）。有沒有辦法讓它同步？ – diegodacal

你甚至嘗試過任何一個建議嗎？你仍然可以使用settimeout –

正如你希望每個迭代是以前的1秒後，你需要改變的setTimeout延遲 - 當它取代了在循環使用forEach

listaCoisas.forEach(function(entry, i){ 
    setTimeout(function(){ 
     $('#word-attribute').empty().append(entry); 
    },(i+1) * 1000); 
});

來源

2017-08-16 01:33:47

明白了！這個想法是設置所有的時間，直到回調運行。謝謝！ – diegodacal

好，這個想法是將'$（'＃word-attribute'）。empty（）。append（entry）;'的每次迭代分開1秒 - 所以第一次在1秒後運行，第二秒鐘在2秒後運行，所有的setTimeout都幾乎在同一時間「開始」 –

以上回答運作良好的代碼，但單獨添加交錯延遲不會使上面的原始代碼工作，我認爲理解原因很重要。

由於closures，在調用第一個setTimeout時，for循環已經運行並且i的值將比數組中的最後一項（第4個索引）多一個。這意味着什麼都不會附加到#word-attribute，因爲它會嘗試追加一個不存在的項目。如果打開控制檯here，則可以看到問題。

有一對夫婦的事情，如果你想保持for循環超出了添加延遲一個定時器，你可以這樣做：

如果要編譯使用像巴貝爾，那麼你可以充分利用你的JavaScript ES6讓關鍵字與它自己關閉。使用let代替var爲i。 Example
使用匿名函數來創建圍繞i變量，我們將稱之爲x匿名函數內的另一個封閉。 setTimeout將在調用時訪問正確的值i。 Example

來源

2017-08-16 02:12:12

數組索引不工作在for循環

回答

相關問題