为什么我的JavaScript代码执行顺序错乱，AJAX调用后才回调执行？

你观察到的执行顺序是AJAX默认异步执行的特性导致的：
JavaScript运行是单线程的，遇到网络请求这类异步IO操作时，不会阻塞等待请求返回结果，而是会先继续执行后面的同步代码，等请求响应回来之后，才会调用提前定义的success回调函数执行对应逻辑。
你当前代码里，给SalesOrderGeneratedNumberID字段赋值的代码是同步执行的，会在AJAX请求的success回调触发前就运行完成，此时strSalesOrderNumberSuffix还没有被赋值为后端返回的流水号，所以会出现取值异常。

把依赖AJAX返回结果的赋值逻辑，挪到success回调函数内执行即可，修改后的代码如下：

// Generate Sales order number located at top of the page
function GenerateSalesOrderNumber() {
    var strDate = new Date();
    var shortYear = strDate.getFullYear();
    var twoDigitYear = shortYear.toString().substr(-2);

    var elem = document.getElementById("HubCountryID");
    var strCountryHubVal = elem.options[elem.selectedIndex].text;

    var strSalesRegionVal = document.getElementById("SalesRegionID").value;

    var strBusinessUnitVal = document.getElementById("SelectBusinessUnitId").value;

    var strSalesOrderNumberPrefix = twoDigitYear + strCountryHubVal + strSalesRegionVal + strBusinessUnitVal;
    $.ajax({
        type: "GET",
        url: "/NewOrder/?handler=SalesOrderNumber",
        data: {},
        contentType: "JSON",
        success: function (response) {
            console.log(response);
            var strSalesOrderNumberSuffix = response.sonRunningNumber;
            // 依赖请求结果的逻辑放到回调内执行
            document.getElementById("SalesOrderGeneratedNumberID").value = strSalesOrderNumberPrefix + strSalesOrderNumberSuffix;
        },
        error: function (data) {
            alert(data);
        }
    });
}

如果强制需要AJAX同步执行（非常不推荐，会导致请求期间页面完全卡住，影响用户体验），可以在ajax的配置项中添加async: false参数，不过优先建议用回调、Promise或者async/await这类异步方案处理。

内容的提问来源于stack exchange，提问作者Johnny Twoknives Krisco