javascript异步获取函数

Question

我正在尝试创建一个递归函数，它为给定数组的每个整数发送一个 PUT 请求，并在其末尾调用另一个函数。

function fetchArchive(arr,state,mailbox){
  if(arr.length == 0){
    load_mailbox(mailbox)
  }
  for(i of arr){
    fetch(`/emails/${arr.shift()}`, {
      method: 'PUT',
      body: JSON.stringify({
          archived: state
      })
    })
    .then(fetchArchive(arr,state,mailbox))
  }
}

但它似乎在获取数组的最后一项之前调用了load_mailbox() 函数。
我知道这应该使用async / await 更好地实现。有人可以举个例子来帮助我理解吗？

更新： 事实证明，下面的代码正在运行

async function fetchArchive(a,s,callback){
  for(i of a){
    await fetch(`/emails/${i}`, {
      method: 'PUT',
      body: JSON.stringify({
          archived: s
      })
    })
    // if i is the last item, load mailbox
    .then(() => { if(i==a[a.length-1] && callback) callback()});
  }
}

Answer 1

这是 async for..of 循环的正确代码

async function fetchArchive(arr,state,mailbox){
    console.log(1)
  if(arr.length === 0){
    load_mailbox(mailbox)
  }
    
  for await (const elem of arr){
    await fetch2(elem);
        arr.shift();

        console.log({ elem })

    fetchArchive(arr,state,mailbox)
  }
}

但是，此代码不起作用并导致无限递归 :) 我认为在迭代中改变数组是个坏主意。 另外，请记住，then 会收到回调。 所以，then 的正确参数是：

.then(response=>fetchArchive(respone))

在您的情况下，您不能将 fetchArchive 作为参数传递给 then 方法，因为 fetchArchive 不返回函数

[更新]

这是数组索引比较的工作代码：

const fetchArchive = async (a, s, callback) => {
  for (const [index, value] of a.entries()) {
    await fetch(index)
      // if i is the last item, load mailbox
      .then(() => {
        if (index == a.length - 1 && callback) {
          callback();
        }
      });
  }
};

关于entries的文档可以找到here