【问题标题】:Is possible to call async function without await keyword? and what happens if we call without await?可以在没有 await 关键字的情况下调用异步函数吗?如果我们在没有等待的情况下调用会发生什么?
【发布时间】:2019-07-27 21:47:27
【问题描述】:

我想执行以下操作,并记住它实际上对我有用。我的问题是会发生什么,是否可以从非异步 componentDidMount() func 调用 async usrs() func? 如果不可能通过调用this.usrs(usrs)而不是await this.usrs(usrs);来为我工作

let outState = {};
class A extends Component{
  componentDidMount(){
   this.usrs(usrs);
  }
  getData(usr){
    return db.collection('a/'+usr+'/bb').get().then(snap=>{
      for(i = snap.docs.length-1; i>=0; i--){
         outState[usr] = [...outState[usr], snap.docs[i].data()];
         if(i === 0) return outState;
      }
     return false;
    });
  }

  async usrs(usrs){

   let os = {}, data = {};

    for(i = usrs.length-1; i>=0; i--){

       os = await this.getData(usrs[i]);
       if(os){
          data = { ...data, ...os };
          if (i === 0) {
             this.setState({ ...this.state, ...data });
          }
       }

    }

  }

}

【问题讨论】:

  • 您可以在任何异步函数上调用 .then 方法,而不是等待调用
  • 作为参考,我刚刚看到这篇文章,它似乎描述了使用和不使用async的变化:dev.to/codeprototype/…

标签: javascript reactjs react-native google-cloud-firestore


【解决方案1】:

在底层,await 只是使用一个 Promise(与 then() 相同),不同之处在于它在继续执行它之后的代码之前等待 Promise 解决。

所以...

使用 await 调用异步函数,您将在异步函数完成后收到结果。 await 之后的任何代码都将在 async 调用返回后执行。

在没有等待的情况下调用异步函数,您将获得一个承诺作为返回值。 await 后面的代码会立即执行。

如果异步调用后面的代码需要异步调用返回的值或依赖于异步调用中发生的某些事情,请使用等待。如果没有,那就不要。

【讨论】:

    【解决方案2】:

    当我们需要调用并等待async函数或Promise时,我们使用await
    在您的情况下,当您在 componentDidMount 中没有 await 的情况下调用它时,您的函数将起作用,但您的 componentDidMount 不会等待该函数完全完成。
    此外,如果您不想使用await 并且不想在componentDidMount 内等待,但又想在async 函数完成时收到通知,则可以改用.then。因为async 函数返回Promise

    这是您的componentDidMount.then
    请注意,在此示例中,this.doSomethingElse 将在 this.usrs 完成之前调用,并且您只会在 .then 内部收到关于您的 this.usrs 结果的通知:

    componentDidMount(){
        this.usrs(usrs).then(() => {
            // Your functions completely finished
        })
        .catch(err => {
            // There was an error
        });
    
        this.doSomethingElse();
    }
    

    【讨论】:

    • 嗨西萨,我认为你的回答很接近我的问题,你能告诉我如果我使用 .then() 函数它会像 await 一样工作吗?我的意思是它 componentDidMount func 将等待函数完全完成?
    • @Muhammad 不,componentDidMount 不会等待,而是会在.then 内收到通知
    • 如果我们不使用 await 并且 componentDidMout 将不会等到 get 完成。那么如果 componentDidMout 不等待会发生什么? 1. 我的 async 函数不会执行 2. 我的 async 函数将在 componentDidmout 函数之后执行
    • @Muhammad 如果您不使用await,您的异步函数将在后台运行,您的componentDidMount 将继续处理而无需等待异步
    【解决方案3】:

    如果调用者需要等待函数完成时,您只需要await,例如当它需要函数的结果时,或者当它需要等待函数引起的某些状态/数据更改时。如果没有这种依赖关系,您可以不使用await 关键字,直接“一劳永逸”。

    正如其他人提到的,您也可以使用.then,但基本规则是相同的:当您在功能完成后有特定的事情要做时,您可以这样做。否则可以省略。

    具体来说:对于“调用者”,我只是指调用异步函数的函数。在您的情况下,这将是componentDidMount。选项非常简单:

    1. 保持原样。 usrs() 将完全在后台运行,componentDidMount 将继续运行直到结束。
    2. 使用await,所以componentDidMount会等待usrs()的返回。
    3. 使用usrs().then(),所以componentDidMount可以继续,但是.then()中指定的代码在usrs()返回之后被调用,如果你需要做一些必须在usrs()完成之后发生的事情。李>

    【讨论】:

    • 能否用我的示例代码提供更多简单的细节
    • 你能告诉我在我的情况下调用函数是什么,直到 this.usrs(usrs);完全完成。
    • 对不起。对于“调用者”,我只是指调用异步函数的函数。我已经添加了这一点,以及您对答案的 3 个选项。
    • 谢谢你的回答,我只是很困惑,如果我们使用 await 所以 componentDidMount 会等待,所以如果有一些函数必须在调用者之后调用它也必须等到来电者完成。同样,如果我们在没有等待的情况下使用并且 usrs() 没有完成,那么 componentDidMount 将不会让它保持活动状态并保持它。
    【解决方案4】:

    函数名之前的异步工作意味着函数总是返回一个promise,所以是的,这是可能的。

    await 让 JavaScript 等待直到 promise 被解决,当你需要处理该 promise 的结果时它会暂停。

    为了更好地理解它,我建议您查看以下页面https://javascript.info/async-await

    【讨论】:

      【解决方案5】:

      您可以从任何地方调用异步函数。 异步函数 returns a promise 所以如果你像下面这样调用它,你可以像使用 Promise 一样使用它。

      async function example(){
        return 10;
      }
      const returnOfAsync = example()
      console.log(returnOfAsync instanceof Promise) // true
      returnOfAsync.then((theReturn) => {
        console.log(theReturn) // 10
      })

      【讨论】:

        猜你喜欢
        • 1970-01-01
        • 2018-06-04
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 2013-11-16
        • 2019-10-27
        • 2013-07-22
        相关资源
        最近更新 更多