async 与 await使用

3.1. mdn 文档

https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Statements/async_function

https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Operators/await

 

3.2. async 函数

1. 函数的返回值为 promise 对象

2. promise 对象的结果由 async 函数执行的返回值决定

 

3.3. await 表达式

1. await 右侧的表达式一般为 promise 对象, 但也可以是其它的值

2. 如果表达式是 promise 对象, await 返回的是 promise 成功的值

3. 如果表达式是其它值, 直接将此值作为 await 的返回值

 

3.4. 注意

1. await 必须写在 async 函数中, 但 async 函数中可以没有 await

2. 如果 await 的 promise 失败了, 就会抛出异常, 需要通过 try...catch 捕获处理

 

<script>
function fn1() {
return Promise.resolve(1) }
function fn2() {
return 2 }
function fn3() {
return Promise.reject(3)
// return fn3.test() // 程序运行会抛出异常
}
function fn4() {
return fn3.test() // 程序运行会抛出异常
}
// 没有使用 await 的 async 函数
async function fn5() {
return 4 }
async function fn() {
// await 右侧是一个成功的 promise
const result = await fn1()
// await 右侧是一个非 promise 的数据
// const result = await fn2()
// await 右侧是一个失败的 promise
// const result = await fn3()
// await 右侧抛出异常
// const result = await fn4()
console.log('result: ', result)
return result+10
}
async function test() {
try {
const result2 = await fn()
console.log('result2', result2) } catch (error) {
console.log('error', error) }
const result3 = await fn4()
console.log('result4', result3) }
// test()
</script>