前端异步编程——async/await
async 从字面上看就是“异步”,它放在函数定义之前,是使该函数在调用时开一个子线程,以不影响主线程的运行。
而 await 经常和 async 组合使用,在 async 定义的函数中来等待需要时间运行的代码(如ajax请求、Promise对象)的运行结果,以做后续的处理。
如下面的返回Promise对象的函数:
function print(delay, message) {
return new Promise(function (resolve, reject) { // 返回Promise对象
setTimeout(function () { // 延迟执行函数
console.log(message);
resolve();
}, delay);
});
}
如果需要运行通过,就需要经过then、catch、finally函数来执行响应的代码:
print(1000, "First").then(function () { // 1秒之后输出“First”
return print(2000, "Second"); // 2秒之后输出“Second”
}).then(function () {
return print(1000, "Third"); // 1秒之后输出“Third”
}).then(function (){
print(2000, "Fourth"); // 2秒之后输出“Fourth”
});
而使用 async/await 可以实现同样的效果,使用异步操作就像同步操作一样简单:
async function asyncFunc() {
await print(1000, "First");
await print(2000, "Second");
await print(1000, "Third");
await print(2000, "Fourth");
}
asyncFunc();
而对于 Promise 中的异常处理,使用 try-catch 来实现:
async function asyncFunc() {
try {
await print(1000, "First"); //1秒后输出"First"
});
} catch (err) {
console.log(err); //输出异常错误
}
try {
await print(2000, "Second"); //2秒后输出"Second"
});
} catch (err) {
console.log(err); //输出异常错误
}
try {
await print(1000, "Third"); //1秒后输出"Third"
});
} catch (err) {
console.log(err); //输出异常错误
}
try {
await print(2000, "Fourth"); //2秒后输出"Fourd"
});
} catch (err) {
console.log(err); //输出异常错误
}
}
asyncFunc();
前端异步编程——async/await的更多相关文章
- 异步编程Async/await关键字
异步编程Async \await 关键字在各编程语言中的发展(出现)纪实. 时间 语言版本 2012.08.15 C#5.0(VS2012) 2015.09.13 Python 3.5 2016.03 ...
- 抓住异步编程async/await语法糖的牛鼻子: SynchronizationContext
长话短说,本文带大家抓住异步编程async/await语法糖的牛鼻子: SynchronizationContext 引言 C#异步编程语法糖async/await,使开发者很容易就能编写异步代码. ...
- 温故知新,CSharp遇见异步编程(Async/Await),聊聊异步编程最佳做法
什么是异步编程(Async/Await) Async/Await本质上是通过编译器实现的语法糖,它让我们能够轻松的写出简洁.易懂.易维护的异步代码. Async/Await是C# 5引入的关键字,用以 ...
- javascript异步编程 Async/await
Async/await Async/await 在学习他之前应当补充一定的 promise 知识 它是一种与 promise 相配合的特殊语法,目前被认为是异步编程的终级解决方案 值得我们每一个人学习 ...
- [C#] 谈谈异步编程async await
为什么需要异步,异步对可能起阻止作用的活动(例如,应用程序访问 Web 时)至关重要. 对 Web 资源的访问有时很慢或会延迟. 如果此类活动在同步过程中受阻,则整个应用程序必须等待. 在异步过程中, ...
- .net 异步编程async & await关键字的思考
C# 5.0引入了两个关键字 async和await,这两个关键字在很大程度上帮助我们简化了异步编程的实现代码,而且TPL中的task与async和await有很大的关系 思考了一下异步编程中的asy ...
- 异步编程async/await
什么是异步? 在异步程序中,程序代码不需要按照编写时的顺序严格执行,有时需要一在一个新的线程中运行一部分代码,有时无需创建新的 线程,但是为了更好的利用单个线程的能力,需要改变代码的执行顺序. 进程 ...
- c#异步编程async await
可以代替协程了 但是需要.net4 版本 unity2017以上版本可以用了 再也可以不用蛋疼的没有返回值的协程了 //异步编程,和Task一起用 async void TestAsync(){ // ...
- .NetCore 异步编程 - async/await
前言: 这段时间开始用.netcore做公司项目,发现前辈搭的框架通篇运用了异步编程方式,也就是async/await方式,作为一个刚接触的小白,自然不太明白其中原理,最重要的是,这个玩意如果不明白基 ...
- .net 温故知新:【5】异步编程 async await
1.异步编程 异步编程是一项关键技术,可以直接处理多个核心上的阻塞 I/O 和并发操作. 通过 C#.Visual Basic 和 F# 中易于使用的语言级异步编程模型,.NET 可为应用和服务提供使 ...
随机推荐
- 虚拟机问题:VMware Workstation 与 Device/Credential Guard 不兼容。在禁用 Device/Credential Guard 后,可以运行
解决办法:关闭Hyper-V功能. windows10使用VMware Workstation打开虚拟机时显示 VMware Workstation 与 Hyper-V 不兼容.请先从系统中移除 Hy ...
- dedebiz 清理冗余废弃未引用图片方法
原理描述: 在原有织梦后台菜单中增加"清理冗余图片按钮",实现清理冗余图片的功能. 操作步骤: 1. 打开后台admin\sys_sql_query.php代码 在该文件中搜索如下 ...
- 「co-examination - A」
破壁,组合意义法: 五种颜色 \(\star,a,b,c,d\). 对于 l.h.s. 钦定 \(k\),在 \(3n+k\) 个球中选出 \(2n\) 个球染色,在靠左的 \(n\) 个球中选 \( ...
- Solution -「洛谷 P4689」「YunoOI 2016」这是我自己的发明
Description Link. 给一个树,\(n\) 个点,有点权,初始根是 1. \(m\) 个操作,种类如下: 1 x 将树根换为 \(x\). 2 x y 给出两个点 \(x,y\),从 \ ...
- MySQL快速导入千万条数据(2)
目录 一.导入前1000万条数据 二.导入前2000万条数据 三.导入后面的1000万条数据 四.建索引 五.总结 接上文,继续测试3000万条记录快速导入数据库. 一.导入前1000万条数据 清库. ...
- mysql5.5自定义函数-计算并赋值
mysql自定义函数的写法 特别注意,将全部的定义现在最前面,然后再写其他语句,因为之前将定义变量和赋值混着写,死活报错.最后一个前同事高手"邢哥"解决. DELIMITER $$ ...
- AttributeError: module 'sqlalchemy' has no attribute '__all__'
升级组件 pip install --upgrade flask-sqlalchemy
- 解决Few-shot问题的两大方法:元学习与微调
.center { width: auto; display: table; margin-left: auto; margin-right: auto } 基于元学习(Meta-Learning)的 ...
- Weight Balanced Leafy Tree 学习笔记
前言: 在这里十分十分感谢 \(\text{lxl}\) 和王思齐发明和总结了 \(\text{WBLT}\). 因为网上关于 \(\text{WBLT}\) 的正确讲解(已除去那篇国家集训队论文,不 ...
- CSS 也能实现 if 判断?实现动态高度下的不同样式展现
最近在群里,有个小伙伴问了这么一道很有趣的问题: CSS 能否实现,容器再某个高度下是某种表现,一旦超出某个高度,则额外展示另外一些内容 为了简化实际效果,我们看这么一张示意效果图: 可以看到,当容器 ...