async await如何在JavaScript中使用setTimeout()

Question

为什么这段代码不起作用

我想以简单的方式学习同步

const post = [];

function getPost(post) {
     console.log(post)
 }

async function createPost (post) {
  await setTimeout(() => {
    post.push({
      name: "John", work: "Developer"
    })
  }, 1000)
  getPost(post);
}

createPost(post);

Answer 1

它不起作用,因为setTimeout不返回承诺.如果你await是一个非承诺,你只需立即获得价值(几乎为1).您还希望使用createPost您的代码当前未执行的返回的承诺.

你必须为它做一个setTimeout返回一个承诺的包装器,例如我在这里的回答所示,虽然这些天我会修改它:

function timeout(delay, ...args) {
    return new Promise(function(resolve) {
        setTimeout(resolve, delay, ...args);
    });
}

这是应用于你的代码的,虽然我假设setTimeout你的代码实际上是一些其他异步操作(ajax,MongoDB等)的替身,我不会这样构造代码(我已经post创建了并返回createPost而不是一个createPost关闭的数组):

function timeout(delay, ...args) {
    return new Promise(function(resolve) {
        setTimeout(resolve, delay, args);
    });
}

const post = [];

function getPost(post) {
    console.log(post)
}

async function createPost(post) {
  await timeout(1000);
  post.push({
      name: "John", work: "Developer"
  });
  getPost(post);
}

// Going async at top level
(async () => {
    await createPost(post);
})().catch(error => {
    console.error(error);
});

¹ "几乎立即" a = await b; ...是语法糖(真的,非常好的糖)Promise.resolve(b).then(a => ...)(加上错误处理).如果b不是承诺,则在a发生任务之后的微任务处理中进行分配await.更多关于我的答案中的任务和微任务.