JavaScript从数组中检索异步数据

除了下面的单向概念外，还可以编辑添加的实际代码。 下面是我试图实现异步阵列访问的结构

for (p = 0; p < myList.length ; p++){ 
    for (k = 0; k < RequestList.length; k++){
        if (RequestList[k].name === myList[p].name){
            data = RequestList[k].data;
            //process data
            return //only intention is to exit if made use of the stored data
        }
    }
    // if mylist.name is not in the Requestlist
    // make the async request for it then push to RequestList array 
    // so the next time this name instance appears we use the previous data
    $.ajax({
            async: true,
            type: 'GET',
            url: url,
            index: p,
            success: function(aData) {
                   let obj = {
                   name : myList[index].name,   
                   data = aData.property //....
                   }
                   RequestList.push(obj);
                   //process data
            }
}

第一循环迭代

value = 5
dogdata = //ajax api request to dog
//attempt to store this data for later use
dataArray[1].name = "dog" 
dataArray[1].data = //async request fills this index with dog data
//process dogdata with value 5

value = 3
catdata = //ajax api request to cat
//need data for cat and there are no cat named objects in the dataArray so
dataArray[2].name = "cat"
dataArray[2].data = //async request fills this index with cat data
//process catdata with value 3

value = 8
//need data for dog but there is an object named dog at dataArray[1]
//so reach out to that instead of a new request
dogdata = dataArray[1].data // empty
//process dog data with value 8 this time!

//need data for monkey and there are no monkey named objects in the array so
dataArray[3].name = "monkey"
dataArray[3].data = //async request fills this with monkey data

//.... goes on like this for many iterations

二次循环迭代

value = 5
dogdata = //ajax api request to dog
//attempt to store this data for later use
dataArray[1].name = "dog" 
dataArray[1].data = //async request fills this index with dog data
//process dogdata with value 5

value = 3
catdata = //ajax api request to cat
//need data for cat and there are no cat named objects in the dataArray so
dataArray[2].name = "cat"
dataArray[2].data = //async request fills this index with cat data
//process catdata with value 3

value = 8
//need data for dog but there is an object named dog at dataArray[1]
//so reach out to that instead of a new request
dogdata = dataArray[1].data // empty
//process dog data with value 8 this time!

//need data for monkey and there are no monkey named objects in the array so
dataArray[3].name = "monkey"
dataArray[3].data = //async request fills this with monkey data

//.... goes on like this for many iterations

第三循环迭代

value = 5
dogdata = //ajax api request to dog
//attempt to store this data for later use
dataArray[1].name = "dog" 
dataArray[1].data = //async request fills this index with dog data
//process dogdata with value 5

value = 3
catdata = //ajax api request to cat
//need data for cat and there are no cat named objects in the dataArray so
dataArray[2].name = "cat"
dataArray[2].data = //async request fills this index with cat data
//process catdata with value 3

value = 8
//need data for dog but there is an object named dog at dataArray[1]
//so reach out to that instead of a new request
dogdata = dataArray[1].data // empty
//process dog data with value 8 this time!

//need data for monkey and there are no monkey named objects in the array so
dataArray[3].name = "monkey"
dataArray[3].data = //async request fills this with monkey data

//.... goes on like this for many iterations

显然，由于第一个异步调用尚未成功，dogdata最终将为空

因此，当dataArray[1]的请求成功时，我希望在不阻塞整个循环的情况下使用该请求响应来处理该请求

可能在这里对第一个请求的成功进行回调或在这里进行承诺解析会很有用

第四循环迭代

value = 5
dogdata = //ajax api request to dog
//attempt to store this data for later use
dataArray[1].name = "dog" 
dataArray[1].data = //async request fills this index with dog data
//process dogdata with value 5

value = 3
catdata = //ajax api request to cat
//need data for cat and there are no cat named objects in the dataArray so
dataArray[2].name = "cat"
dataArray[2].data = //async request fills this index with cat data
//process catdata with value 3

value = 8
//need data for dog but there is an object named dog at dataArray[1]
//so reach out to that instead of a new request
dogdata = dataArray[1].data // empty
//process dog data with value 8 this time!

//need data for monkey and there are no monkey named objects in the array so
dataArray[3].name = "monkey"
dataArray[3].data = //async request fills this with monkey data

//.... goes on like this for many iterations

---

试试这样的

var mylist = [], dataArray = new Array(mylist.length), callCount = 0, callbackCounts = 0;
function getAsyncData(request, index, callback) {
    $.ajax({
        async: true,
        type: 'GET',
        url: request.url,
        index: index,
        success: function (aData) {
            let obj = {
                name: myList[index].name,
                data: aData.property
            };
            dataArray[index] = obj;
            callback();
        },
        error: function () {
            console.log('error for ' + myList[index].name);
            callback();
        }
    });
}
function allDataLoaded() {
    //all data loaded
}
myList.forEach(function (listItem, idx) {
    var found = dataArray.some(function (el) {
        return el.name === listItem.name;
    });
    if (!found) {
        callCount++;
        getAsyncData(listItem, idx, function () {
            callbackCounts++;
            if (callbackCounts === callCount) {
                allDataLoaded();
            }
        });
    }
});

---

您需要提供更多实际的代码。在这一点上，这个问题太抽象了，无法回答，因为有很多方法可以实现异步性，并且答案将非常分别。请参阅：感谢您的回答！希望这能让事情更清楚。听起来你需要承诺。这将允许您发出单独的ajax请求并执行一些功能，而不会阻塞。在制定解决方案之前需要查看更多代码谢谢，这给了我一个开始的想法，但这里的问题是没有固定数量的回调计数。请求列表的长度可以是10，所有10个请求都可以是不同的请求，或者所有10个请求都可以是相同的请求。谢谢，我实现了这一点，结果很好，但我可能仍然更愿意使用基于承诺的结构，因为不执行所有加载前=过程感觉更好。感谢您的帮助，虽然这将完美地工作，直到我想出如何做替代结构！