异步代码返回错误变量的问题

Question

我是使用AJAX编码的新手，无法理解为什么以下使用回调的异步函数无法正常工作。变量PC为全局变量，并设置为PC = 666进行测试。应该为PC分配一个从XML文件读取的值1。我正在使用的代码如下。

function makePlaceRequest(XMLaddress, callback) {
        httpRequest = new XMLHttpRequest();
        // alert('Starting XML read');
        if (!httpRequest) {
            alert('Warning :( Cannot create an XMLHTTP instance');
            return false;
        }

        // httpRequest.onreadystatechange = getPlace;

        // State changes

        httpRequest.onreadystatechange = function() {
            try {
                if (httpRequest.readyState === XMLHttpRequest.DONE) {
                    if (httpRequest.status === 200) {
                        var xmldoc = httpRequest.responseXML;
                        var root_node = xmldoc.getElementsByTagName('placecode').item(0);
                        PC = root_node.firstChild.data;
                        // callback();
                    }
                    else {
                        alert('There was a problem with the request.');
                    }
                }
            }
            catch( e ) {
                alert('Caught Exception: ' + e.description);
            }
        }

        httpRequest.open('GET', XMLaddress);
        // httpRequest.open('GET', '/xml/Places.xml');
        httpRequest.send();

        callback();
    }

    makePlaceRequest('/xml/Places.xml', function() {
        alert(PC);
        alert('Completed XML read');
        alert(PC);
    });

我按如下方式调用该函数：makePlaceRequest('/xml/Places.xml');第一个（PC）警报显示666，即在成功读取XML文件之前调用了回调，第二个PC警报显示了正确的值，即1我认为后者的发生是由于信息消息（已完成的XML读取）引入的延迟。我不明白为什么在处理完成之前根本要调用回调函数。

Answer 1

对httpRequest.send（）的调用是异步的，因此不会等待AJAX​​调用完成。因此，很有可能在AJAX调用收到响应并处理该响应之前调用callback（）。

当收到响应时，程序流将被中断以运行onreadystatechange处理程序。当onreadystatechange处理程序完成运行后，中断的程序流将恢复。

onreadystatechange处理程序中注释掉的callback（）将确保仅在接收和处理响应后才调用您的callback（）。