等待等效请求待处理

Question

我有这个代码：

var data = {};
var dataPending = {};
function getData(name, callback) {
    callback = callback || function() {};
    // new response
    if (!data[name] && !dataPending[name]) {
        dataPending[name] = true;
        sendGetRequest({
            url      : '/blah-blah/' + name,
            callback : function(response) {
                data[name] = response;
                delete dataPending[name];
                return callback();
            }
        });
    // equivalent request in progress
    } else if (dataPending[name]) {
        // TODO how to wait for equivalent request is completed and return callback?
    // data is exists
    } else {
        return callback();
    }
}
getData('name1', function() { ... });
getData('name1', function() { ... });
getData('name2', function() { ... });
getData('name2', function() { ... });
getData('name1', function() { ... });

函数 sendGetRequest 是 xmlhttprequest 的封装。有用。但... 如何等待等价请求完成并返回回调？

Answer 1

添加一个数组变量，您可以将请求推送到等待。然后在你原来的回调中，如果数组中有一个项，则抓取第一个，将其从数组中删除，然后调用 getData。

例如，

var dataQueue = [];
var active = false;
function getData(name, callback, force) {
    if(active && !!force) {
        dataQueue.push({name: name, callback: callback});
    }
    else {
        active = true;
        sendGetRequest({
            url: '/blah-blah/' + name,
            callback : function(response) {
                if(dataQueue.length > 0) {
                    active = false;
                }
                else {
                    var reqObj = dataQueue.shift();
                    getData(reqObj.name, reqObj.callback, true);
                }
                return callback();
            }
        });
    }
}

基本思想是有一个指示工作是否正在完成的标志和一个数组来保存我们想要等待发送的请求。当您确实获得数据时，如果我们已经在处理请求（通过我们的active 标志）将项目推入队列，否则继续运行它并将 active 设置为 true。在sendGetRequest 的回调中，我们查看dataQueue 是否有任何项目——如果没有，我们不再处于活动状态，因此将标志设置为false。如果有项目，则获取数组的第一项并将其删除。然后在该项目上调用 getData，将 force 设置为 true，以允许它进行处理。

请注意，在回调中检查队列中是否有项目的逻辑应该分解为一个单独的函数。您可能还想用 0MS 将其包装在 setTimeout 中，以便 return callback() 不必等待队列处理逻辑。