时间戳

首页 > 解决方案 > JS - 为什么 await 在课堂上不起作用

javascript - JS - 为什么 await 在课堂上不起作用

问题描述

我需要在一个类的函数中等待一段时间。我试图改编Jonas W.答案：https ://jsfiddle.net/5wk2cohe/

const sleep = ms => new Promise(res => setTimeout(res, ms));

class K {
  run(n) {
    (async function() {
      document.body.textContent = n;
      await sleep(1000);
    })();
  }
}

var v = new K();
for (let n = 0; n < 4; n++) {
  v.run(n);
}

但是计数会立即提示 3. 如果我运行https://jsfiddle.net/tctxcn9o/ ，我会看到一个计数器例外：

const sleep = ms => new Promise(res => setTimeout(res, ms));

 (async function() {
   for(let n = 0; n < 4; n++) {
     document.body.textContent = n;
     await sleep(1000);
   }
})();

我做错了什么？

[更新] 一些背景：在我的家乡，一个非常古老的程序 JavaKara 非常流行，它可以帮助高中学生学习如何编码：

爪哇卡拉

看看瓢虫是如何移动的，对于理解和发现你的错误非常有帮助。所以我试图在瓢虫的每一步之后等待一段时间。

标签： javascriptasynchronous

解决方案

正如El Aoutar Hamza所说，您正在创建 4 个异步任务，其中每个任务都会立即运行。为了延迟下一个任务，您需要await在循环内部使用并使run函数返回一个 Promise，如下所示：

const sleep = ms => new Promise(res => setTimeout(res, ms));

class K {
  async run(n) {
    document.body.textContent = n;
    await sleep(1000);
  }
}

(async function() {
  var v = new K();
  for (let n = 0; n < 4; n++) {
    await v.run(n);
  }
})();

推荐阅读