美文网首页
async await

async await

作者: 印第安老斑鸠_333 | 来源:发表于2019-04-17 13:12 被阅读0次

概述:

ES2017 标准引入了 async 函数,使得异步操作变得更加方便,它的语法和结构会更像是标准的同步函数

语法:

1.当调用一个 async 函数时,会返回一个 Promise 对象。当这个 async 函数返回一个值时,Promise 的 resolve 方法会负责传递这个值;当 async 函数抛出异常时,Promise 的 reject 方法也会传递这个异常值。

例:

resolve

promise状态为成功,then的第一个回调执行

PS:如果返回的promise的状态为成功,你不return,then的成功回调拿不到参数


reject

promise状态为失败,then的第二个回调执行

PS:如果返回的promise的状态为失败,是用不到return的,then的失败回调照样拿到参数


2.async 函数中可能会有 await 表达式,这会使 async 函数暂停执行,等待Promise的结果出来,然后恢复async函数的执行并返回解析值(成功or失败)。async函数返回的 Promise 对象,必须等到内部所有await命令后面的 Promise 对象执行完,才会发生状态改变,除非遇到return语句或者抛出错误。也就是说,只有async函数内部的异步操作执行完,才会执行then方法指定的回调函数。

注意,await关键字仅仅在 asyncfunction 中有效。如果在async function函数体外使用await,你只会得到一个语法错误(控制台报错)。

例:

await console.log

如果await返回的promise失败了,也就是reject函数执行了,那么async函数里面,await后面的语句全部不会再执行,看下图,只打印了一个。

PS:如果没有await,当async内部失败了,也会如此。

reject

如果你return的不是await返回的promise对象的处理结果,那么当awiait返回的promise对象成功时,你return的值将传进this的成功回调。失败就不提了,因为函数就不会往下执行了。

resolve console.log

如果想让函数内的代码将继续执行,用try..catch.语法

try...catch console.log

由上可见,a的值为undefined,也就是说await后面的promise如果失败,await是拿不到结果的。


一个await后面如何接多个promise?不能,但是Promise.all()方法可接受多个promise对象,并返回一个promise对象,可以用await后面接这个api,就能同时处理多个promise结果了。

但是一个async函数内可以用多个await,但这样比较耗时,因为下一个await总会等上一个await执行完才执行,所以推荐上面的写法。


总结:

1.async函数会返回一个promise对象(下文用‘它’表示),return的值作为then的成功回调参数。失败不用return,报错或者rejuect执行时的参数会自动传入then的失败回调参数。

2.它的then方法的成功回调参数,一定由return决定。

3.await  操作符用于等待一个promise 对象。它只能在异步函数 asyncfunction 中使用。返回 Promise 对象的处理结果。如果等待的不是 Promise 对象,则返回该值本身

4.await 后面的promise失败了,那么它也失败了。

5.只要它的状态为失败,那么从哪里失败的,后面的代码就不执行了。

6.如果想要继续执行后面代码,用try...catch

相关文章

  • async和await

    浅谈Async/Await用 async/await 来处理异步 async和await async:声明一个异步...

  • ES8(一) —— async&await

    目录 async和普通函数的区别 await async/await处理多回调异步 async和await必须配合...

  • async

    async/await特点 async/await更加语义化,async是“异步”的简写,async functi...

  • ES6中的好东西

    1 Await/Async 前端的回调时代我没有赶上,我赶上的是await/async时代。await和async...

  • Vue接口调用方式(三)async/await用法

    async/await用法 1. async/await的基本用法 async/await是ES7引入的新语法,可...

  • nodejs async 使用简介

    async await node async 使用

  • JS 中的 async/await

    async/await 是什么? async/await 是 ES2017 中新增的异步解决方案; await 只...

  • ES2017 async 函数

    async 和 await 在干什么 每个名称都有意义async : 异步await: async wait简...

  • async/await

    async/await async/await 是Generator的语法糖。 Generator 通过将Gene...

  • 小程序-云开发

    async和await async:异步(无等待)await:等待(是为了同步) 一、await 关键字只在 as...

网友评论

      本文标题:async await

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