getJSON 请求循环遍历参数数组，每次调用之间有延迟

Question

谁能帮我理解为什么下面的 jQuery/Javascript 代码，而不是以每秒 1 次的节奏运行，而是有这种 ajax 调用的级联雪崩（慢到每秒很多）？

var i = 0, l = data.length;

function geocode() {

$.getJSON(
    'https://maps.googleapis.com/maps/api/geocode/json',
    {
        key: "xxxxx",
        sensor: false,
        address: data[i][3],
        region: 'gb'
    },
    function(d, textStatus, jqXHR) {
        if(d["status"] == "OK") {
            console.log(data[i][3]);
            console.log(d["results"][0]["geometry"]["location"]);
            i++;
            if(i < l) { window.setInterval(geocode, 1000); }
        }
    }
);

}

geocode();

在我的脑海里是这样流动的：

1. 第一次调用地理编码
2. 发出 Ajax 请求
3. 成功后（任意时间后）我读取结果
4. 增加索引
5. 如果我们尚未扩展数组，请设置另一个地理编码调用以在 1 秒后开始

供参考：“数据”是英国邮政编码的嵌套数组，我正在尝试使用 Google 的地理编码 API 检索坐标。

Answer 1

您不断设置新的间隔，并且永远不会取消之前的间隔。您应该使用clearInterval() 取消间隔或使用一次性setTimeout。

如果您使用间隔，则在设置间隔时保存该值：

var intervalId;
....
intervalId = setInterval(...);

然后

clearInterval(intervalId); 

当您需要新的间隔时。 或使用setTimeout() 并根据需要重新签发。