Question

以下示例中有两个问题：

为什么x在y之前记录？为什么x是一个承诺？

我希望bar等待foo解析为值'Hello'后再返回。

let foo = () => {
    return new Promise((resolve, reject) => {
        setTimeout(() => {
            resolve('Hello');
        }, 2000);
    })
}

let bar = async () => {
    let y = await foo();
    console.log(y);
    return y;
}

let x = bar();

console.log(x);

我希望看到的是

'Hello' // console.log(y)
'Hello' // console.log(x)

我得到的是

 Promise {<pending>}  // console.log(x)
 'Hello'              // console.log(y)

bar是否要等foo解析后再返回y？

任何帮助将不胜感激！

Answer 1

以下是关于async function的文档：https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/async_function

和Promise对象：https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise

据指出，async function返回处于Promise状态的pending对象，直到它被解决为止。

现在让我们看看您的代码：

由于没有x关键字来停止执行，因此您将bar()的返回值Promise分配给await（并且您不能添加一个，因为您不在async function之外，因为async function bar()尚未返回，因此该承诺记录为未决。

同时，在async function bar()中，您将y的返回值也分配给async function foo()，但这一次您要等待结果。等待2秒后，将履行诺言，并使用Promise方法的参数y记录resolve()。

因此，您看到的行为是预期的行为。

Answer 2

您需要await函数：

let example = async () => {
    let foo = () => {
        return new Promise((resolve, reject) => {
            setTimeout(() => {
                resolve('Hello');
            }, 2000);
        })
    }

    let bar = async () => {
        let y = await foo();
        console.log(y);
        return y;
    }

    let x = await bar();

    console.log(x);
}

example();

Answer 3

您应在调用await之前使用bar()，但实际上，仅当通过await函数将其包装时，才可以使用async，如下所示：

async function Func() {

  let foo = () => {
    return new Promise((resolve, reject) => {
      setTimeout(() => {
        resolve('Hello');
      }, 2000);
    })
  }

  let bar = async () => {
    let y = await foo();
    console.log(y);
    return y;
  }

  let x = await bar();

  console.log(x);

}

执行Func();后，您的期望就会激发。

在等待完成之前返回异步函数

3 个答案: