Question

我在异步函数中使用await按特定顺序执行函数，如果你在这里看到 - 我希望startAnim等到hideMoveUI完成执行后才能执行。

虽然我的控制台日志返回：

startAnim
hideMoveUI

我的代码：

async function printAll() {
  await hideMoveUI();
  await startAnim();
}
printAll();

hideMoveUI = () => {
    setTimeout(() => {
      console.log('hideMoveUI');
    }, 3000);
  }

startAnim =() => {
    setTimeout(() => {
      console.log('startAnim');
    }, 500);
  }

setTimeout是async函数吗？

如何让第二个功能等待第一个功能完成？任何帮助或建议表示赞赏。提前谢谢。

Answer 1

两个问题：

您的hideMoveUI / startAnim函数没有返回值，因此调用它们会产生undefined。 await undefined为undefined。
如果您修复＃1，await将等待一个计时器句柄，在浏览器上是一个数字。 await无法知道该号码是计时器句柄。

相反，give yourself a promise-enabled setTimeout并使用它。

E.g：

const wait = (delay, ...args) => new Promise(resolve => setTimeout(resolve, delay, ...args));

const hideMoveUI = () => {
  return wait(3000).then(() => console.log('hideMoveUI'));
};

const startAnim = () => {
  return wait(500).then(() => console.log('startAnim'));
};
  
async function printAll() {
  await hideMoveUI();
  await startAnim();
}
printAll()
  .catch(e => { /*...handle error...*/ });

或当然

const wait = (delay, ...args) => new Promise(resolve => setTimeout(resolve, delay, ...args));

const hideMoveUI = async () => {
  await wait(3000);
  console.log('hideMoveUI');
};

const startAnim = async () => {
  await wait(500);
  console.log('startAnim');
};
  
async function printAll() {
  await hideMoveUI();
  await startAnim();
}
printAll()
  .catch(e => { /*...handle error...*/ });

async / await函数不等待setTimeout完成

1 个答案: