帶有參數的遞歸javascript函數？

Question

我得到了這個javascript遞歸函數：

function doStuff(graphName) {
    var groupArray = new Array();
    groupArray[0] = "hour";
    groupArray[1] = "day";
    groupArray[2] = "month";
    for(var i = 0; i < groupArray.length; i++) {
        $.get("getchartdata", {"graphName" : graphName, "subgroup" : groupArray[i]})
              .done(function(jsonData){
                  var data = eval(jsonData);
                  drawChart(data, data[0][0], data[0][1]);
              });

    }
    setTimeout(doStuff, 10000);
}

現在的問題是，它第一次運行良好，但是在再次嘗試10秒后，它顯示了一個錯誤：

TypeError: data[0] is undefined in drawChart(data, data[0][0], data[0][1]);

為什么會這樣呢？

如果我在setTimeout(doStuff(graphName), 10000);添加參數setTimeout(doStuff(graphName), 10000);

瀏覽器崩潰。

謝謝。

Answer 1

我認為您想要的是：

setTimeout(function() { 
    doStuff(graphName); 
}, 10000);

---

還值得注意的是，如果您的AJAX呼叫完成時間超過10秒，您可能會開始看到一些“毛刺”。 也許考慮將超時移到.done回調內部（這意味着它在ajax完成后 10秒鍾再次運行）。 但是，這只是一個建議，如果這不適合您的需求，則可以保持原樣。 另外，這可能不適合，因為您在for循環中調用ajax，並且如果執行不正確，可能會導致超時超出您的期望。

Answer 2

如果要傳遞graphname參數，則需要顯式執行！ 好像你想要的

function doStuff(graphName) {
    var groupArray = ["hour", "day", "month"];
    for(var i = 0; i < groupArray.length; i++) {
        $.get("getchartdata", {"graphName" : graphName, "subgroup" : groupArray[i]})
              .done(function(data){
                  drawChart(data, data[0][0], data[0][1]);
              });
    }
    setTimeout(function() {
        doStuff(graphName); // again
    }, 10000);
}

另一種可能性是為下一次doStuff調用綁定參數：

setTimeout(doStuff.bind(this, graphName), 10000);

Answer 3

在這種情況下，通常需要在內部函數中執行艱苦的工作，而最初提供的參數可以通過閉包使用：

function doStuff(graphName) {
    (function loop() {
         // draw the graph using "graphName" from the outer scope
         ...
         setTimeout(loop, 10000);
    })();  // invoke immediately to start the process
}

使用閉包可以避免重復傳遞參數的重復，避免重復調用，因為您可以將引用傳遞給內部函數。

這也與AJAX配合使用-只需將setTimeout調用放入.done處理程序中即可。 在進行三個AJAX調用時，請在內部函數中嘗試此操作，該函數將等待所有三個AJAX調用完成，然后再啟動計時器：

var def = [];

for (var i = 0; i < groupArray.length; i++) {
    def[i] = $.get("getchartdata", {"graphName" : graphName, "subgroup" : groupArray[i]})
          .done(function(data) {
              drawChart(data, data[0][0], data[0][1]);
          });
}

// wait for all three deferred objects to be resolved
$.when.apply($, def).done(function() { setTimeout(loop, 10000) });