javascript - 在循环内的函数调用之间添加延迟

Question

我有一个遍历数组的循环。

我想调用一个函数，将数组的每个元素用作它的参数。

var arr = [1, 2, 3];

for (const a in arr) {
  console.log('immediately logging for ', a)
  setTimeout(() => {
    // wait for 5 seconds before doing next console logging
    function1(a)
  }, 5000);
}

var function1 = (a) => {
  console.log('after 5 seconds, logging for ', a)
}

为了增加延迟，我在每两次迭代之间使用了 setTimeout。;然而，恰恰相反的情况正在发生

如果我们运行这段代码，所有即时日志控制台输出都会立即打印出来。5 秒后，所有日志记录一起发生。

如何完美地为 function1 的每次迭代添加延迟，而不是立即在循环中调用它？

我可能没有完美地提出问题，如果有任何不清楚的地方，请在评论中提问:)

Answer 1

最简单的方法是使用异步/等待:

function sleep(ms) {
    return new Promise((res, rej) => {
        setTimeout(() => {
            res();
        }, ms);
    });
}

async function main() {
    const arr = [1, 2, 3];
    for (const a of arr) {
        console.log(a);
        await sleep(1000);
    }
}

main();