async
用于声明异步函数,返回值为一个Promise 对象,它以类似"同步"的方式来写异步方法,语法与声明函数类似
返回值
返回值是 Promise 对象,异步结果是通过 .then() 或者 .catch() 方法来获取并进行进一步处理的,定义的异步函数中的返回值会当成 resolve 状态来处理,一般用 .then()
方法处理,而如果定义的异步函数抛出错误,例如变量未定义,则会被当做reject状态来处理,一般使用.catch() 方法来处理。
await
用法顾名思义,有等待的意思。
let value = await Promise();
其实就是暂停当前async function内部语句的执行,等待后面的 Promise() 处理完返回结果后,再继续执行async function函数内部剩余的代码。
注意!
await 必须在 async 函数内部使用 如果await 后面跟的是其它值 则直接返回该值
下面代码需要用Vue运行
<template>
<div></div>
</template>
<script>
export default {
created() {
async function fn() {
console.log("我"); // 返回值1
await new Promise(function (resolve) {
setTimeout(function () {
console.log("吃"); // 返回值2
resolve();
}, 5000);
});
console.log("饭"); // 返回值3 返回值3基于返回值2的返回时间
}
fn();
},
};
</script>
<style></style>
下面的是未加await的代码
<template>
<div></div>
</template>
<script>
export default {
created() {
async function fn() {
console.log("我"); // 返回值1
new Promise(function (resolve) {
setTimeout(function () {
console.log("吃"); // 返回值3
resolve();
}, 5000);
});
console.log("饭"); // 返回值2 没有加await就会出现异步
}
fn();
},
};
</script>
<style></style>
返回结果
和上面说的一样 await 会等后面的Promise 返回结果后才会执行async函数里面剩余的代码