美文网首页
理解await与async

理解await与async

作者: 有一个程序媛 | 来源:发表于2021-01-21 16:12 被阅读0次

await

await的意思就是等待。它后面可以跟一个表达式。如果是值(如字符串、数字、普通对象等等)的话,返回值就是本身的值。

不过最常用的是后面跟一个promise对象。await会等待这个promise的状态由pending转为fulfilled或者rejected。在此期间它会阻塞,延迟执行await语句后面的语句。

如果promise对象的结果是resolve,它会将resolve的值,作为await表达式的运算结果。

如果有第二次请求的话,promise需要在then方法继续调用,再用then接受,过多的嵌套依然会增加阅读难度。而await async只需要像写同步代码一样继续书写就可以,它是解决异步编程回调地狱的终极手段

function asyncFn(){

  return new Promise(function(resolve, reject){

        setTimeout(function(){

            console.log('resolve console')     

            resolve('resolve return')

        }, 2000)

  })

}

// promise

asyncFn().then((res) => {

      console.log(res, '----------------')

}

控制台打印结果:图一

// await

var res = await asyncFn() 

console.log('~~~~~~~~~', res)

控制台打印结果:图二

图一 图二


async

之前我们知道了await会阻塞代码的执行。而解决这个弊端的手段就是async声明。

async function asyncFn(){

      return 'async'

}

console.log(asyncFn())

控制台打印结果:图三  打印的是一个promise对象。而且是Promise.resolve对象。resolve的值就是asyncFn的函数返回值async

asyncFn().then((res) => {

    console.log(res, '----------------')

})

控制台打印:async, '----------------'

图三

​ 其实之所以async声明能解决await的阻塞问题,就是因为async声明将函数作了一层promise包装,这样内部的异步操作其实就是由pending转为resolve或者reject的过程。这样函数本身就能够随意调用,函数内部的await也不会再影响到函数外部的代码执行。

参照:https://www.cnblogs.com/jsgoshu/p/11444404.html

相关文章

网友评论

      本文标题:理解await与async

      本文链接:https://www.haomeiwen.com/subject/locdzktx.html