为什么我可以将功能转换为与异步同步的工作

Question

我有一个显示电子商务订单的 html 页面。我使用复选框选择其中一些，并使用对 php 服务器的 ajax 请求创建发票。

现在我想创建这些发票 3 × 3。例如，如果我有 4 张发票，我将发出 ajax 请求 2 次，并向用户显示该过程。下面是我的代码，我实现了异步/等待。但是它无法同步。我运行下面的代码来处理 4 张发票。

我期望的输出应该在 javascript 控制台中：

"Hello"
"Bye"
"Hello"
"Bye"

但它正在打印到控制台：

"(2)Hello"
"(2)Bye"

我缺少什么？这是代码：

  function processInvoices(){

  var arr_ordersToBeProcessed = [];

  let bulkCount = 3;
  let currCount = 0;
  let totalCount = jQuery("#div_orders").find('.invoiceCheckbox:checked').length;

  jQuery("#div_orders").find('.invoiceCheckbox').each(async function(i, obj) {

    let clickedOrder = $(obj).parent().parent().parent();

    if($(obj)[0].checked == true){

      let obj_singleOrder = {};

      obj_singleOrder.orderNumber = clickedOrder.find('.div_orderNumber').text();
      arr_ordersToBeProcessed.push(obj_singleOrder);

      currCount++;

      if(currCount%3==0 || currCount==totalCount){
          console.log("hello");
          const data = await jQuery.ajax({
                 type: "POST",
                 url: "./_production/createInvoices.php",
                 data: {
                   orders: JSON.stringify(arr_ordersToBeProcessed)
                 }
           });
          arr_ordersToBeProcessed = [];
          console.log("bye");

          if(currCount==totalCount){
            alert("Completed!"); return;
          }
      }
    }
  });
}

Answer 1

您正在误解“等待”的作用。它不会使您的呼叫同步。它只能让您以不同的方式编写代码，以便连续多个异步函数调用不会导致您的代码级联到地狱。

如果您想使用jQuery实现同步的http调用，则可以通过添加

async: false

（如下所述”>我如何才能使jQuery执行同步，而不是异步，ajax请求？）。

但是，我强烈建议不要使用同步HTTP呼叫，因为它会在接听电话时使您的网站无响应。