网站首页 > 博客文章 正文
什么是async
async的意思是“异步”,顾名思义就是有关异步操作的关键字,async 是 ES7 才有的,与我们之前说的Promise、Generator有很大的关联。
使用语法:
async function name(param){
param //传递给函数的参数名称
statements //函数体
}
name().then(function(res){
res//异步操作返回的结果
})
async 函数返回一个Promise对象,可以使用then方法添加回调函数。具体实例如下:
async function show(){
return {a:12,b:15}
}
console.log(show())//Promise {<fulfilled>: {…}}
show().then(res=>{
console.log("res",res)
})
什么是await
await关键字存在async函数表达式中,用于等待Promise对象,暂停执行,等到异步操作完成后,恢复async函数的执行并返回解析值。如果把await放在asnyc函数体外,会报语法错误。
使用语法:
asnyc function name(){
returnValue = await expression;
}
expression 是一个Promise对象或一个需要等待的值,针对所跟不同表达式,有两种处理方式:
对于Promise对象,await会阻塞主函数执行,等待Promise对象执行resolve之后,resolve返回值作为await表达式运算结果,然后继续向下执行。
对于非Promise对象,可以是字符串、布尔值、数值以及普通函数等。await直接返回对应的值,而不是等待其执行结果。
await等待Promise对象实例如下:
async function test1(){
console.log("执行")
return new Promise((resolve,reject)=>{
setTimeout(()=>{
console.log("延迟3秒之后返回成功")
resolve({a:'1'})
},3000)
})
}
async function test2(){
let x = await test1()
console.log("x",x)//{a: "1"}
return x
}
test2().then(function(res){
console.log("res",res)//{a: "1"}
})
await 跟 普通函数 实例如下:
function test3(){
console.log("普通函数")
}
async function test4(){
await test3()
console.log("直接执行")
}
test4()
捕获异常
上述的await后跟Promise对象,我们知道Promise有两种状态,resolved() 和 rejected() ,如果Promise对象变为rejected,会如何处理?
function testAwait(){
return Promise.reject("error");
}
async function test1(){
await testAwait();
console.log("test1");//没有打印
}
test1().then(v=>{
console.log(v);
}).catch(e=>{
console.log(e);//"error"
})
从上实例执行结果发现,返回的reject状态被外层的catch捕获,然后终止了后面的执行。但是在有些情况下,即使出错了我们还是继续执行,而不是中断,此时我们借助try...catch捕获内部异常。
function test1(){
return new Promise((resolve,reject)=>{
reject("error")
})
}
async function test2(){
try{
await test1()
}catch(e){
console.log("报错",e)
}
}
test2().then((res)=>{
console.log("执行成功",res) // 打印:执行成功undefined
}).catch(err=>{
console.log('err',err)
})
Generator与async对比:
- async利用await阻塞原理,代替了Generator的 yield 。
- async 相比Generator 不需要 run 流程函数,完美地实现了异步流程。
从 Promise 到 Generator , 再到 async ,对于异步编程的解决方案越来越完美,这就是ES6不断发展的魅力所在。
猜你喜欢
- 2024-11-09 ES6 fetch()方法详解(es6find方法)
- 2024-11-09 手把手一行一行代码教你手写Promise
- 2024-11-09 把 Node.js 中的回调转换为 Promise
- 2024-11-09 BAT前端经典面试问题 es6之promise原理,promise应用场景
- 2024-11-09 ES6 完全使用手册附加案例实战讲解
- 2024-11-09 ES6 的常用新特性(es6特性及使用场景)
- 2024-11-09 Es6基础语法(es6语法重点整理)
- 2024-11-09 「新手向」 Promise课程笔记整理(promise yo)
- 2024-11-09 ES6中的Promise.resolve()到底有何作用呢
- 2024-11-09 常用的ES6新特性,你都有掌握吗?快来学习一下吧
你 发表评论:
欢迎- 最近发表
- 标签列表
-
- powershellfor (55)
- messagesource (56)
- aspose.pdf破解版 (56)
- promise.race (63)
- 2019cad序列号和密钥激活码 (62)
- window.performance (66)
- qt删除文件夹 (72)
- mysqlcaching_sha2_password (64)
- ubuntu升级gcc (58)
- nacos启动失败 (64)
- ssh-add (70)
- jwt漏洞 (58)
- macos14下载 (58)
- yarnnode (62)
- abstractqueuedsynchronizer (64)
- source~/.bashrc没有那个文件或目录 (65)
- springboot整合activiti工作流 (70)
- jmeter插件下载 (61)
- 抓包分析 (60)
- idea创建mavenweb项目 (65)
- vue回到顶部 (57)
- qcombobox样式表 (68)
- vue数组concat (56)
- tomcatundertow (58)
- pastemac (61)
本文暂时没有评论,来添加一个吧(●'◡'●)