javascript - 当最内层循环等待响应时如何延迟嵌套迭代？

Question

以下是我的问题陈述的概述:

我正在尝试为在线多项选择问卷调查表生成解决方案。这个想法是编写一个 JavaScript 函数来迭代所有问题并找出正确的答案。

为了简单起见，我将只尝试一个问题，由 levelNo 和 questionNo 变量唯一标识，选择一个选项，提交表单 通过 JavaScript，从而提交对所选问题的回答并跳过所有其他问题。

表单提交的结果是正确响应的数量。因此，如果表单提交的结果是“1”，则所选选项是正确的，否则是错误的。我不断迭代每个问题的选项，直到找到正确的答案。

典型的同步性问题

现在，问题是表单提交需要相当长的时间，并且我的 JavaScript 代码会继续执行，而无需等待请求完成和响应返回。我希望延迟迭代，直到加载响应。

function solve(){
    var options = ['a', 'b', 'c', 'd'];
    for(var levelNo = 1; levelNo<=5; levelNo++){
        for(var questionNo = 1; questionNo <=10; questionNo++){
            var solved = false;
            for(var i=0; i<4 && !solved; i++){
                var questionId = levelNo+'_'+questionNo; 

                $.ajax({
                    method:"POST", 
                    url: "get_scores.php",
                    data : questionId+'='+options[i]
                }).done(function (data, textStatus, jqXHR) {
                    var sectionScore = $(data).text().trim();               
                    if(sectionScore == "1"){
                        solved = true;
                        console.log(questionNo+"->"+options[i]);    
                    }   
                });                 
            }           
        }
    }
}

正如大家所见，我通过使用 jQuery.done() 进行 AJAX 调用，解决了一个请求的问题。但是，我无法在迭代中解决这个问题。

我知道我的方法的设计在同步意义上是完全不正确的，因为我每次在继续迭代之前都在等待响应。我可以使用顺序 XMLHttpRequest 并将 jQuery AJAX 中的 async 设置为 false 来解决该问题。

但我想探索这种方法，希望/期望更多地了解回调/闭包，因为我的研究发现许多帖子都在谈论回调作为此类问题的潜在解决方案。

所以，出于学术兴趣，我想知道是否可以使用异步请求和回调来解决上述问题。如果是这样，怎么办？如果不是，为什么回调的概念不适用于此场景？还有其他可以使用的javascript原理吗？

TL;DR :我希望延迟嵌套迭代，直到加载来自网站的 JSON 响应。回调有帮助吗？

Answer 1

这应该有效，但请注意，我总是检查所有答案。如果您已经有了正确的答案，更好的方法应该避免再次询问同一问题。

var options = ['a', 'b', 'c', 'd'];

var answers = [];
var solutions = {};
var requestScore = function(questionId,optionSelected){
    $.ajax({
        method:"POST", 
        url: "get_scores.php",
        data : questionId+'='+optionSelected
    }).done(function (data, textStatus, jqXHR) {
        var sectionScore = $(data).text().trim();               
        if(sectionScore == "1"){
            solutions[questionId] = optionSelected;
        }
        if ( answers.length > 0 ){
            requestScore.apply( this, answers.shift() );
        }else console.log( solutions ); //your solutions
    });
};

for(var levelNo = 1; levelNo<=5; levelNo++){
    for(var questionNo = 1; questionNo <=10; questionNo++){
        for(var i=0; i<4; i++){
            var questionId = levelNo+'_'+questionNo; 
            answers.push( [questionId,optionSelected] );//wherever optionSelected comes from               
        }           
    }
}

requestScore.apply( this, answers.shift() );